GD: Texte als Grafiken anzeigen lassen

[Enrico]

Hallo,

man kann ja mittels PHP Text als Grafiken anzeigen lassen, um beispielsweise eMail-Adressen besser zu schützen:

http://id2.php.net/manual/en/book.image.php

Wenn man nun eine spezielle Schriftart haben will, muss diese mit auf den Server hochgeladen werden, das ist mir klar.

Ist es dann so, dass der umgewandelte Text im Browser des Betrachters auch dann in der von mir festgelegten Schriftart angezeigt wird, wenn die Schriftart nicht auf dem Rechner des Betrachters installiert ist?

Wie ist es generell um die Qualität der erstellten grafischen Texte bestellt?

Vielen Dank und Gruß
Enrico

[LX]

Wenn Du den Text auf dem Server in der Schriftart renderst, muss sie natürlich nicht auf dem PC des Betrachters installiert sein.

Die Qualität der "grafischen Texte" hängt stark vom Renderer ab. Je nach installierter Freetype-Version sind bei der libgd Antialiasing und Full Hinting aktiv, so dass eine sehr gute Qualität erreicht werden kann.

Gruß, LX

[dedlfix]

Hi!

Ist es dann so, dass der umgewandelte Text im Browser des Betrachters auch dann in der von mir festgelegten Schriftart angezeigt wird, wenn die Schriftart nicht auf dem Rechner des Betrachters installiert ist?

Wenn du das Bild eines Balls an jemanden sendest, muss der dann den Ball haben, um ihn auf dem Bild sehen zu können?

Wie ist es generell um die Qualität der erstellten grafischen Texte bestellt?

Abhängig von Grafikformat und Auflösung. Je mehr Punkte auf einer Fläche zur Verfügung stehen, desto detaillierter kann man Bilder erstellen. Das Grafikformat kann zu Lasten der Qualität und zu Gunsten des Speicherverbrauchs auch noch Information wegkompimieren. Vor allem auf JPEG trifft das zu. Text als Grafik kommt im Gegensatz zu Fotos oft mit wenigen Farben aus, weswegen palettenbasierte Formate wie PNG und GIF genommen werden können, die weniger verlustreich arbeiten. Am besten ist, du probierst das mit einem Grafikprogrammmal selbst aus, dann siehst du, ob dir das Ergebnis gefällt oder nicht.

Lo!

[[Dankesehr] Enrico]

Hallo,

vielen Dank für eure Antworten, ihr habt mir hier schon sehr weitergeholfen :-)

Gruß
Enrico

[[Eigenes Skript] Enrico]

Hallo,

sorry für mein nicht beabsichtigtes Doppelposting weiter oben.

Ich war der Ansicht, dass mein Problem nicht ganz zu meiner "alten" Anfrage passen würde, deshalb die "Neueröffnung", ich wollte mich keineswegs "vordrängen" oder doppelt posten.

Gut... Ich hatte in meiner Einstiegsanfrage "(PHP) GD: Texte als Grafiken anzeigen lassen" einige Fragen zur Umwandlung von "normalem" Text in grafischen Text.

Aber diese Methode scheint nicht die richtige zu sein, um mein Vorhaben umzusetzen:

Ich erzeuge aus einem beliebigen Text einen grafischen Text, indem ich anstelle des Textes Grafiken anzeigen lasse, was in meiner vorherigen Fassung (die nachfolgend aufgeführte Version ist bereits die erweiterte) ohne Prüfung auf korrekte Trennung der Wörter, auch funktioniert.

Allerdings stehe ich nun vor dem Problem, Sätze trennen zu müssen und das funktioniert aktuell noch nicht wie geplant (im unteren Teil Näheres dazu).

Bevor ich in's Detail einsteige erstmal Entschuldigung für meine sehr lange Anfrage, ich hoffe, die Länge verärgert niemanden, aber ich wollte mein Problem so ausführlich wie möglich schildern, damit ihr meinen Ansatz auch nachvollziehen und mir bei der Fehlersuche besser helfen könnt.

Hier zunächst mal der aktuelle und in Blöcke unterteilte Code, anhand dessen ich mein Vorhaben/Problem besser erläutern kann:

+---
     |  $Inhalt  = 'Ok, dann schauen wir mal, wie das Layout mit der grafischen Schrift

aussieht. Ich kann es ja so nicht abschätzen, deshalb [...]';
     |  $Anzahl_Zeichen= strlen ($Inhalt);
   1 |  $Breite_gesamt = 0;
     |  $Pfad = "Grafiken/Tastatur/";
     |  $Temporaerer_String  = "";
     |  $Zeichen_hinzufuegen = true;
     +---
     |  for ($Stelle = 0; $Stelle < $Anzahl_Zeichen; $Stelle++)
     |  {
   2 |     $Einzelnes_Zeichen = substr ($Inhalt, $Stelle, 1);
     |     $Zeichencode = ord ($Einzelnes_Zeichen);
     |     $Groesse  = getimagesize ($Pfad . $Zeichencode . ".png");
     |     $Breite_gesamt += $Groesse[0];
     +---
   3 |     if ($Breite_gesamt > 200)
     |     {
     +---
   4 |        if ($Zeichencode == 32)
     |        {
     +---
   5 |           $Temporaerer_String .= " | ";
     |        }
     +---
     |        else
     |        {
   6 |           $Position_letztes_Leerzeichen = strrpos ($Temporaerer_String, " ");
     |           $Temporaerer_String  = substr ($Temporaerer_String, 0,

$Position_letztes_Leerzeichen) . " | ";
     |           $Stelle  = $Position_letztes_Leerzeichen;
     |        }
     +---
     |        $Breite_gesamt = 0;
   7 |        $Zeichen_hinzufuegen = false;
     |     }
     +---
     |     if ($Zeichen_hinzufuegen)
     |     {
   8 |        $Temporaerer_String .= $Einzelnes_Zeichen;
     |     }
     +---
   9 |     $Zeichen_hinzufuegen = true;
     |  }
     +---

+-------+
|BLOCK 1|
+-------+
Ich habe eine Variable $Inhalt, die den umzuwandelnden Text enthält. Mit Umwandeln meine ich, dass anstelle der "normalen" Buchstaben jedes einzelneZeichen durch einen grafischen Buchstaben ersetzt wird.

Die Variable $Anzahl_Zeichen ermittelt die Gesamtzahl der in $Inhalt enthaltenen Zeichen.

$Breite_insgesamt wird die aufsummierte Breite der Variablen $Temporaerer_String in Pixeln enthalten und wird hier auf 0 zurückgesetzt.

$Temporaerer_String wird letztendlich die den "normalen" Zeichen aus $Inhalt korrespondierenden Grafiken in HTML-Notation enthalten.

Zudem habe ich noch einen Schalter $Zeichen_hinzufuegen, der erstmal auf "true" gesetzt wird und der darüber entscheiden wird, ob Zeichen noch hinzugefügt werden oder nicht.

+-------+
|BLOCK 2|
+-------+
Hier beginnt nun die eigentliche Umwandlung.

Ich durchlaufe über $Stelle die Variable $Inhalt vom ersten bis zum letzten Zeichen ($Anzahl_Zeichen) und extrahiere hier pro Schleifendurchlauf jeweils ein Zeichen und weise dieses Zeichen der Variablen $Einzelnes_Zeichen zu.

Danach ermittle ich den ANSI-Code des aktuell extrahierten Zeichens, da ich die grafischen Buchstaben der ANSI-Tabelle entsprechend benannt habe, sowie Höhe und Breite des grafischen Buchstabens, wobei ich nur die Breite, also $Groesse[0], für meine weiteren Schritte benötige und addiere sie zu $Breite_gesamt.

+-------+
|BLOCK 3|
+-------+
Nun prüfe ich, ob die aufsummierte Breite der bisher hinzugefügten bzw. des hinzuzufügenden Zeichens größer als 200 (Pixel) ist, diese Größe ist hier aber nur zu Testzwecken so niedrig gewählt.

+-------+
|BLOCK 4|
+-------+
Als nächstes prüfe ich, ob das aktuelle hinzuzufügende Zeichen ein Leerzeichen ist und ...

+-------+
|BLOCK 5|
+-------+
... füge eine optische Kennzeichnung in $Temporaerer_String ein. Diese optische Kennzeichnung wird aber letztendlich durch einen Zeilenumbruch ersetzt und soll mir hier nur zeigen, ob die Trennung richtig funktioniert.

+-------+
|BLOCK 6|
+-------+
Jetzt kommt der Block, der mir enorme Kopfzerbrechen bereitet, weil ich hier die Ursache der falschen Trennung vermute (wie oben bereits geschrieben nachfolgend Details hierzu).

Mit diesem "else"-Zweig befinde ich mich damit in der Annahme, dass ein anderes Zeichen außer dem Leerzeichen, also beispielsweise ein Buchstabe oder ein Satzzeichen, die 200px-Grenze sprengt.

Ich ermittle die Position des zuletzt vorkommenden Leerzeichens, damit ich keine Wortteile oder ein bloßes Satzzeichen zu Beginn meiner neuen Zeile habe, splitte $Temporaerer_String da auf und setze ebenfalls wieder eine optische Kennzeichnung. Zudem setze ich $Stelle auf die Position des zuletzt vorkommenden Leerzeichens zurück, da mir ja ansonsten Buchstaben und Zeichen fehlen würden.

+-------+
|BLOCK 7|
+-------+
$Zeichen_hinzufuegen wird auf "false" gesetzt, da ich in diesem aktuellen Durchlauf kein Zeichen mehr hinzufügen würde, weil 200px sonst überschritten würden, ebenso setze ich $Breite_gesamt wieder auf 0, da ja hiermit nach der optischen Kennzeichnung bzw. dem späteren Zeilenumbruch eine neue Zeile beginnen soll.

+-------+
|BLOCK 8|
+-------+
Nun sind wir in dem Block, der entweder das aktuell extrahierte Zeichen hinzufügt oder nicht, in Abhängigkeit vom Schalter $Zeichen_hinzufuegen, der ...

+-------+
|BLOCK 9|
+-------+
... hier wieder auf "true" gesetzt wird, weil sonst gar nichts mehr hinzugefügt wird.

Würde mein Skript korrekt arbeiten, dann hätte ich folgende Aufteilung des Textes:

Ok, dann schauen wir
 mal, wie das Layout
 mt der grafischen
 ^
207px

Wobei "korrekt" auch nicht ganz stimmt, da es beim gekennzeichneten "m", das eine Gesamtbreite von 207px "verursachen" würde, das "i" weggelassen wird.

Stattdessen habe ich folgende Ausgabe:

Ok, dann schauen wir | mal, wie das Layout | | | | | | | | | | Schrift aussieht. Ich | | es ja so nicht | | | | | | | | | | | | | | | | | schauen wir mal, wie | das Layout mit der | | | | Schrift aussieht. Ich | | es ja so nicht | | | | | | | | | | | | | | | | | schauen wir mal, wie | das Layout mit der | | | | Schrift aussieht. Ich | | es ja so nicht | | | | | | | | | | | | | | | | | schauen wir mal, wie | das Layout mit der | | | | Schrift aussieht. Ich | | es ja so nicht | | | | | | | | | | | | | | | | | schauen wir mal, wie | das Layout mit der | | | | Schrift aussieht. Ich | | es ja so nicht | | | | | | | | | | | | | | | | | schauen wir mal, wie | das Layout mit der | | | | Schrift aussieht. Ich | | es ja so nicht | | | | | | | | | | | |

Die Trennung erfolgt nicht korrekt, zudem werden ganze Wörter verschluckt, was ich mit Block 6 vermeiden wollte. Ststtdessen habe ich mehrere optische Kennzeichnung hintereinander.

Und ich komme absolut nicht dahinter, wo der/die Fehler liegt/liegen.

Ich hoffe inständig, dass ihr mir hier bei der Fehlersuche behilflich sein könnt.

Und nochmals:

Entschuldigung für die enorme Länge.

Vielen Dank und Gruß
Enrico