Bilder in Studio einbinden (Webcam, Diagramme...)

[buempi]

Hallo Maik

Ich habe es auch ausprobiert; allerdings mit Arial, weil ich deine Schrift nicht habe. Es scheint, dass es nicht bei dir liegt. Er putzt einfach die blauen Pixel rund um die Schrift nicht sauber weg.

Mach das Bild grösser (sagen wir mal: 500 x 300), die Schrift ebenfalls (60) und verkleinere das Bild dann in der Ansicht; so ist der blaue Rand um die Schrift nicht mehr sichtbar. Damit die Darstellung übersichtlich bleibt, also die Schrift nicht ineinander läuft, musst du natürlich auch die Positionen anpassen.

Viele Grüsse
Bümpi

[Sanys]

Hallo Maik,

Das mit dem blauen Rand liegt an der Art und Weise, wie die True-Type-Schrift in das Bild eingefügt wird. Offensichtlich werden die Ränder "geglättet", damit keine Pixel übrigbleiben (Treppenstufen). Das hat zur Folge, dass der blaue Hintergrund noch durch den Schriftrand durchscheint. Studio braucht aber ein Pixel in blau, um es durchsichtig darzustellen.
Ein Versuch wäre statt imagecreatetruecolor nur imagecreate zu verwenden. Das ergibt ein Bild mit "schlechterer" Bildqualität, evtl. löst es aber Dein Problem. Vielleicht sieht es aber auch ganz fürchterlich aus.
Versuch macht kluch, vielleicht baust Du es mal ein und lädst die Bilder hier hoch, damit man den unterschied sehen kann?

Ansonsten gibt es ja noch Funktionen für die Bildbearbeitung mittels php. Evtl. sieht es besser aus, wenn Du ein Bild mit der Schrift erzeugst und diese dann über ein anderes Bild, welches nur blau ist, drüberkopierst.

Was ich aber bisher bei mir gemacht habe: ich habe nicht blau für durchsichtig als Hintergrund gewählt, sondern die gleiche Farbe, die auch in meiner Ansicht als Hintergrund verwendet wird (an vielen Stellen ist es da selbe grau, dass auch bei einem AnzeigeObjekt als Hintergrund verwendet wird. ImageColorAllocate ($im, 236, 233, 216))
Damit ist natürlich der Vorteil der Transparenz weg (überlagern mit anderen Objekten), aber die Nachteile wenn die Pixel geglättet wurden sind, gibt es auch nicht.


Viel Erfolg


sanys

[buempi]

Hallo zusammen

Ich habe auch Versuche mit Imagecreate() gemacht. Da wird bei mir - unerklärlicherweise - der Hintergrund gelb!

Habe einige Zeit geübt, aber die besten Resultate ergaben sich schon mit einem möglichst grossen Bild, das man dann verkleinert. Dabei muss man aber mit der Maus fast pixelweise vorgehen, damit sowohl in der Höhe als auch in der Breite keine Schatten entstehen. Die Schrift wirkt aber einfach "ausgefranst".

Das Beste, was ich bisher hingekriegt habe, ist das:

[mfreye]

Hallo zusammen!

Bümpi:

Willst du deine Digital-Anzeige jetzt auf TT-Schriften umstellen? - Schade um die Mühe im anderen Thread

1. Gebrauche die Anzeige noch für ne Digi Uhr.
2. Ich hätte das Problem auch jetzt bekommen, da ich mehre Grafiken von den Raumregler in einer Anzeige unterbringen möchte.
3. Wir haben dazu gelernt.
4. Das einzig was unschön ist, dass ich Deine zeit in Anspruch genommen habe!!! Aber nochmals Danke!!!

Zum Thema:

Ich habe auch Versuche mit Imagecreate() gemacht. Da wird bei mir - unerklärlicherweise - der Hintergrund gelb!

Ja so ist es auch bei mir und es sieht gleich wie bei Dir aus. Aber es könnte schlechter!

Was ich aber bisher bei mir gemacht habe: ich habe nicht blau für durchsichtig als Hintergrund gewählt, sondern die gleiche Farbe, die auch in meiner Ansicht als Hintergrund verwendet wird (an vielen Stellen ist es da selbe grau, dass auch bei einem AnzeigeObjekt als Hintergrund verwendet wird. ImageColorAllocate ($im, 236, 233, 216))
Damit ist natürlich der Vorteil der Transparenz weg (überlagern mit anderen Objekten), aber die Nachteile wenn die Pixel geglättet wurden sind, gibt es auch nicht.

Wie bekomme ich denn die Reihenfolge der Bilder hin. Es wird immer das neuste Objekt nach vorne gelegt?!


So habe hier mal ein Bild hoch geladen:

http://www.mfreye.de/Haussteuerung/Bild ... zimmer.bmp

Mit der ersten Lösung sieht es besser aus (hier noch als Digi Uhr):

http://www.mfreye.de/Haussteuerung/Bilder/Netzwerk.bmp

MfG
Maik Freye

[buempi]

Hallo Maik

Das mit der "vergeblichen Mühe" habe ich natürlich ironisch gemeint!!! Ich hoffe, du hast es auch so verstanden

Wirklich toll, deine Visualisierungen! Die Anzeige deiner Raumregler-Werte entspricht etwa der Qualität, die auch ich erreicht habe. Mehr scheint nicht drin zu liegen. Habe auch Versuche mit anderen Schriftfarben gemacht. Sehr interessant ist, dass die Schriftfarbe 0,0,255 nicht etwa ein vollständig durchsichtiges Bild, sondern eine mehr oder weniger schraffierte Schrift anzeigt!!! Im Photo-Editor sieht man aber nur eine blaue Fläche...

Nach meinen Versuchen bin ich zum - vorläufigen - Schluss gekommen: Die sauberste Anzeige erhält man, wenn man KEINEN transparenten Hintergrund hat und das BMP weder vergrössert noch verkleinert; also kein Haken bei "Bildgrösse variabel". Zu deinem Layout würde doch ein gelber Hintergrund ganz gut passen? Einfach 2 Bitmaps machen für die Temperaturen und die Ventilstellung...


Wenn man in der Visualisierung Objekte übereinander legt, werden sie nachher in der Reihenfolge, wie die Objekte erstellt wurden, aufeinander gelegt. Das Jüngere überdeckt also das Ältere.

Es bleibt nichts übrig, als das Objekt, welches oben liegen soll, zu löschen (hoffentlich gibt's nicht noch viele Bezüge in anderen Makros, die man vorher auskommentieren muss) und neu anzulegen. Vorher speichert man natürlich das Makro im Editor, damit man es nachher mit copy and paste wieder zurückholen kann. Das Definieren der Variablen und der Einstellungen (z.B. Zuordnung von Bitmaps) bleibt einem allerdings nicht erspart.

Viele Grüsse
Bümpi

[mfreye]

Hallo Bümpi!

Das mit der "vergeblichen Mühe" habe ich natürlich ironisch gemeint!!! Ich hoffe, du hast es auch so verstanden

Wahr ironisch gemeint? Ab und zu verstehe ich doch mal was

Wirklich toll, deine Visualisierungen!

Ist noch in den Kinderschuhen, komme zur Zeit kaum dazu

Wenn man in der Visualisierung Objekte übereinander legt, werden sie nachher in der Reihenfolge, wie die Objekte erstellt wurden, aufeinander gelegt. Das Jüngere überdeckt also das Ältere.

Das ich ja toll Ich habe es mir schon gedacht. Dieses Manko sollte man in einer neuern Version abstellen, kann ja für contronics nicht so schwer sein?!

MfG
Maik Freye

[buempi]

Ich hab's

Sanys hat ja schon sehr gut erklärt, warum die blauen Ränder rund um die Schriftzeichen entstehen. Es gibt dort eben Pixel, die teils schwarz und teils blau (Mischfarbe) sind; deshalb also nicht mehr transparent sind. Man sieht das sehr gut, wenn man sich das Bitmap in Paint stark vergrössert.

Zunächst bin ich mal auf die Idee gekommen, den Hintergrund zuerst in Weiss zu malen, dann reinzuschreiben und dann den Hintergrund mit IMAGEFILL() wieder blau (transparent) zu füllen. Dann werden nämlich nur die rein-weissen Pixel durch blaue ersetzt. Sieht schon sehr gut aus, aber: IMAGEFILL() füllt nur den Hintergrund rund um die Schrift aus; der "Innenraum" einer Null bleibt weiss, ist also nicht transparent.

Wer sucht der findet: Natürlich am gleichen Ort, wo wir schon die BMP.PHP her haben gibt's auch noch die IMAGEBW.PHP. BW steht für black and white.

Diese Funktion wandelt ein Bild zuerst in Graustufen um und ersetzt dann alle Pixel entweder durch schwarze oder weisse. Ihr erratet wohl schon, wie's weitergeht:

1. Die IMAGEBW.PHP herunterladen: http://www.jpexs.com/php.html

2. Da wir ja nicht schwarz/weiss, sondern schwarz/blau (transparent) wollen, in dieser Datei folgende Ersetzung vornehmen:

Code: Alles auswählen

// ALT:
$pwhite=imagethiscolor($img,255,255,255);
// NEU:
$pwhite=imagethiscolor($img,0,0,255); // rein blau -> transparent

3. Am Anfang des Scripts von mfreye die IMAGEBW.PHP mit INCLUDE() einbinden.

4. Im Script von mfreye folgende Zeile ändern:

Code: Alles auswählen

// ALT
$blue = ImageColorAllocate ($im, 0, 0, 255);
// NEU
$blue = ImageColorAllocate ($im, 255, 255, 255);  // weiss

5. Im Scipt von mfreye vor dem Befehl "ImageBmp" folgende Zeile einfügen:

Code: Alles auswählen

ImageBW($im,"NORMAL");

Das Ergebnis kann sich sehen lassen:

[Sanys]

Guten Abend zusammen,

@ mfreye: ich habe mir Deine Visualisierungen mal angesehen. Du möchtest also die Raumregler zusammen mit einem Thermostatventil anzeigen bzw. einfach eine Digitaluhr (Netzwerkvisualisierung).
Das Problem ist die durchsichtige Farbe (blau), die Studio zwar braucht, in einem anderen Programm ist es aber nun mal blau. Wenn mann mit php Truetypeschriften in eine Grafik schreibt werden die Ränder geglättet. Zumindest in der Variante, wie wir sie hier gerade verwenden: Bild wird mit imagecreatetruecolor erzeugt, imagettftext wird verwendet.
Man kann das Kantenglätten ausschalten, das geht aber nur wenn man das Bild mit imagecreate erzeugt. Ein so erzeugtes Bild scheint aber in Studio nicht ganz richtig angezeigt zu werden (blau wird gelb nach eueren Angaben). Ich werde das auch mal testen (irgendwann). Um das Kantenglätten (antialiasing) auszuschalten muß der Farbe ein - (minuszeichen) vorangestellt werden. Beispiel: imagettftext ( $im, 8, 0, 4, 11, -$schwarz, $schrift, $dat );
Das sieht dann so aus wie nach buempis "Behandlung" mittels schwarz/weis.

Aber wieso läßt Du das durchsichtige nicht einfach weg? Gib der erzeugten Grafik als Hintergrund die selbe Farbe, die der Hintergrund in Deiner Visualisierung (an dieser Stelle) hat. Man sieht keine Ränder, wenn ein Objekt mit der gleichen Farbe draufgelegt wird. Bei der Uhr in Deiner Netzwerkvisualisierung ist es überhaupt kein Problem. Beim Heizungsregler erzeugst Du ja eine Grafik mit den Temperatur Soll/Ist-Werten und der Ventilstellung. Dann fülle doch einfach den Hintergrund mit Deiner Hintergrundfarbe, schreibe dann die Werte drauf und dann füllst Du die untere rechte Ecke, da wo nachher der Thermostat angezeigt werden soll, mit blau. Diese Ecke wird in Studio dann durchsichtig und Du hast den Thermostaten angezeigt und Schriften mit Kantenglättung. So habe ich das bei meinen Grafiken bisher gemacht.

Die durchsichtige Farbe (blau) innerhalb von Studio ist leider nur ein "Trick", denn bmp-Grafiken können gar kein durchsichtig. Deshalb lassen sich damit nur "harte" Kanten durchsichtig darstellen. In einem Grafikprogramm kann man aber sanfte übergänge zur jeweiligen Hintergrundfarbe erzeugen und das als Bild in Studio einfügen (Objektzustand oder php-erzeugtes Bild). Solange der Hintergrund eine einheitliche Farbe ohne Muster ist sieht es genauso aus wie ein durchsichtig darüber gelegtes Bild. Das ist zwar etwas um die Ecke gedacht haut aber hin.

Im übrigen kann man auch die Hintergrundgrafik dynamisch gestalten, da auch diese beim Ansichtenwechsel IMMER eingelesen wird!! Leider akzeptiert Studio hier ausschliesslich bmp, so daß die Erstellung mittels php recht zeitintensiv ist.


So, wenn noch Fragen offen sind, dann fragen!


Viel Erfolg


sanys

[mfreye]

Hallo zusammen!

@Bümpi

Danke so geht es super und einfach!

http://www.mfreye.de/Haussteuerung/Bild ... zimmer.bmp

@sanys

Danke für die Hilfe!

Aber wieso läßt Du das durchsichtige nicht einfach weg? Gib der erzeugten Grafik als Hintergrund die selbe Farbe, die der Hintergrund in Deiner Visualisierung (an dieser Stelle) hat. Man sieht keine Ränder, wenn ein Objekt mit der gleichen Farbe draufgelegt wird. Bei der Uhr in Deiner Netzwerkvisualisierung ist es überhaupt kein Problem. Beim Heizungsregler erzeugst Du ja eine Grafik mit den Temperatur Soll/Ist-Werten und der Ventilstellung. Dann fülle doch einfach den Hintergrund mit Deiner Hintergrundfarbe, schreibe dann die Werte drauf und dann füllst Du die untere rechte Ecke, da wo nachher der Thermostat angezeigt werden soll, mit blau. Diese Ecke wird in Studio dann durchsichtig und Du hast den Thermostaten angezeigt und Schriften mit Kantenglättung. So habe ich das bei meinen Grafiken bisher gemacht.

Das geht sicherlich, aber ist immer sehr aufwendig. Jetzt nehme ich die Grafik setze sie ab, wo sie hin soll und wenn etwas im Hintergrund ist, ist das auch gleich. So wie das Bümpi geschrieben geht alles was ich möchte.

So, wenn noch Fragen offen sind, dann fragen!

Da kommen bist noch viele! Vor allen möchte ich den Sonnenaufgang und Untergang jetzt realisieren.

Ich hätte da gleich auch eine

Wenn ich ne neuere Version vom php nehme geht mein Script nicht mehr! Warum? Die neuere Version ist wohl nötig für den Sonnenaufgang und Untergang!
Mit der php Version von contronics läuft es ohne Probleme.
Mit einer neueren Version wird ein Script fehler angezeigt, aber nicht was das Problem ist. Es steht nur Scriptfehler.

MfG
Maik Freye

[Sanys]

Hallo Maik,

klar ist es einfacher mit "durchsichtig" zu positionieren, mir gefallen aber die kantengeglätteten Schriften besser.


Zu Deinen Fragen: Das mit Sonnenauf und Untergang gibts schon in einem anderen Thread, such mal nach "unzufrieden mit Homeputer Sonnenzeiten".
Die php-Version upzugraden ist nicht zwingend nötig, tsa (Thomas) hat da schon einen Workaround beschrieben.

Wenn ich ne neuere Version vom php nehme geht mein Script nicht mehr! Warum? Die neuere Version ist wohl nötig für den Sonnenaufgang und Untergang!
Mit der php Version von contronics läuft es ohne Probleme.
Mit einer neueren Version wird ein Script fehler angezeigt, aber nicht was das Problem ist. Es steht nur Scriptfehler.

Hast Du auch ALLE beteiligten php-Dateien ausgetauscht?
Du brauchst aus dem php-Paket die Dateien für Studio UND natürlich die verwendeten Extensions.
Bei mir ist das die php5ts.dll im homeputer Studio Verzeichnis sowie die beiden extensions für Grafik und MySQL: php_gd2.dll und php_mysql.dll. Für die Bilderzeugung ist die gd2 natürlich nötig.

.. und wegen der Sonnenzeiten bitte im entsprechenden Thread weitermachen.


Viel Erfolg


sanys