SVG Eingekreist Text auf textPath (mittig ausrichten)
Hab ich ein problem mit eingekreisten text im SVG-Format. Mein Ziel ist, erstellen Sie den Pfad, der mir erlauben zu schreiben, aber auch zentrieren Sie den text, noch verfolgen mit meinen Weg - aus dem oberen Teil des Kreises.
Beispiel
Das ist, was es sieht aus wie (Bild inside)
Problem
Derzeit bin ich mit textPath + Pfad-Kombination zu erzeugen, Pfad und schreiben Sie auf es.
<svg>
<defs>
<path id="textPath" d="M 200 175 A 25 25 0 0 0 182.322 217.678" />
</defs>
<text x="25" y="0"><textPath xlink:href="#textPath" startOffset="0" >here goes my text</textPath></text>
</svg>
Ich habe auch versucht Raphael Bibliothek zu verwalten, es funktioniert, aber im ernst, ich kann nicht tun, was ich will. Ist hier jemand, der es tatsächlich geschafft, damit es funktioniert? Oder gibt es eine Möglichkeit es so zu machen?
Du musst angemeldet sein, um einen Kommentar abzugeben.
definieren Sie Ihren text als Pfad die komplette Obere Hemisphäre des elliptischen Bogens, die Sie zeichnen möchten auf:
und legen Sie die
startOffset
IhrertextPath
zu 50%. beachten Sie, dass Sie Ihre svg-Datei nicht wohlgeformt ist, wie es ist ohne die namespace-definition für xlink. das folgende ist eine funktionierende standalone-Beispiel:re: Kommentar auf eine Lösung für die gehen alle den Weg rund um den Kreis:
der Kern ist, um den text festlegen, der Pfad erstreckt sich entlang der gesamten Umfang, wie diese: