SVG Viewer
Mit diesem Modul kann ein SVG Viewer eingebunden werden. Damit ist es möglich SVG Code live im Browser übersetzen und anzeigen zu lassen.
Das Modul einbinden
Um das Modul nutzen zu können, muss die Einbindung des Moduls über den Meta-Tag features
erfolgen (siehe auch Abschnitt "Javascript"):
Das Modul verwenden
Die Verwendung des Moduls wird über einen HTML-Tag gesteuert. Er wird an der gewünschten Stelle eingefügt:
<div class="svg-viewer"></div>
Konfiguration vornehmen
data-config
- Übergabe der Konfiguration im JSON Format, Reihenfolge beliebig
-
filenameSVG
Dateiname einer Datei im Projektordner. -
height
Höhe (Standardwert: 400px). -
head
kann auf true gesetzt werden. Damit ist der Editor in einem erweiterten Modus und es wird nicht nur der Inhalt des svg-Tags sondern auch der Tag selbst angezeigt. Damit ist auch eine umfangreichere Konfiguration möglich (z.B. viewbox). (Standardwert: false)
Beispiel leerer Editor
<div class="svg-viewer"></div>
Beispiel mit eingebundener Datei und verringerter Höhe
<div class="svg-viewer" data-config='{"filenameSVG":"test-bild.svg", "height":"100px"}'></div>
Beispiel mit Anzeige des SVG-Tags
<div class="svg-viewer" data-config='{"filenameSVG":"test-bild-2.svg", "head": true}'></div>