5.5Der Textpfad
Im allgemeinen wird ein Text entlang einer geraden Linie geschrieben. In SVG ist es jedoch zusätzlich möglich ihn entlang eines beliebigen Pfades auszurichten. Dabei werden die Positionen und Rotationen der einzelnen Zeichen automatisch berechnet. Zur Erstellung eines Textpfades benötigt man das Element <textPath>
. Dieses muß sich innerhalb eines <text>
-Blocks befinden und enthält zum einen den auszurichtenden Text und zum anderen eine Referenz auf den Pfad, an dem der Text ausgerichtet werden soll.
Selbstverständlich kann ein mittels <textPath>
ausgerichteter Text mit beinahe allen bisher kennengelernten Methoden manipuliert werden, d.h. man kann beispielsweise das Element <tspan>
verwenden, um einzelne Textpassagen zu formatieren. Es gibt allerdings auch Ausnahmen, wie etwa das Stilelement text-decoration, das bei einem Text, der entlang eines Pfades verläuft, keine Wirkung zeigt. Die meisten Texteigenschaften wie etwa die Schriftdicke, die Schriftgröße oder der Schriftstil sind jedoch uneingeschränkt nutzbar.
Wie ein Textpfad erstellt wird, zeigt das folgende Listing 5-16.
<?xml version="1.0"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <path id="text_path" x="0" y="0" d="M10 10 C100 150 200 200 200 100 C200 100 200 20 250 20" fill="none" stroke="silver" /> <text style="font-size:24px"> <textPath xlink:href="#text_path">an einem Pfad ausgerichteter Text</textPath> </text> </svg>
Abbildung 5-16 zeigt die dazu passende Ausgabe im SVG-Betrachter. Der Textpfad steht gewöhnlich im Definitionsabschnitt und ist somit nicht sichtbar. Im Beispiel soll er nur der Anschaulichkeit dienen.
5.5.1Eigenschaften des Textpfades
Die Startposition eines Textes ist standardmäßig immer am Anfang des Pfades. Mit Hilfe der Eigenschaft startOffset
kann die Position eines Textes aber auch verschoben werden. startOffset
erwartet dafür eine Längenangabe in Form einer positiven oder negativen Zahl oder eines Prozentwertes.
Die nächste Eigenschaft bezieht sich auf den Abstand der einzelnen Zeichen. spacing
heißt das dafür zuständige Attribut. Es kann die Werte exact
oder auto
erhalten, wobei exact
als Standardwert gesetzt ist und den Viewer dazu veranlaßt, den exakten Regeln der SVG-Spezifikation zum Verhalten von Text an Pfaden zu folgen. Wurde der Wert auto
gesetzt, benutzt der Viewer einen speziellen Text-an-Pfaden-Algorithmus, um die Zeichen korrekt zu setzen.
Zuletzt soll noch kurz das Attribut method
angesprochen werden, das die Rendering-Methode der Textzeichen festlegt. Es kann die beiden Werte align
(Standard) oder stretch
besitzen. Bei align
werden die Zeichen mittels Transformationen, wie etwa Translationen oder Rotationen, ausgerichtet. Die zweite Methode wandelt alle Zeichen in Pfade um, paßt die Punkte dieser Pfade an die Vektoren des Textpfades an und skaliert u.U. die Textzeichen dementsprechend. Diese Methode erlaubt etwa bessere Ergebnisse bei Schreibschriften, da durch die Biegungen der Kurve ein Auseinanderreißen der Buchstabenverbindungen korrigiert werden kann.