Laden SVG in SVGWeb dynamisch mit JQuery

Ich versuche, einige SVG Inhalt dynamisch anzuzeigen. Dieser Inhalt wird als Zeichenfolge in meiner Datenquelle gespeichert. Ein Beispiel Zeichenfolge wie folgt aussehen würde:Laden SVG in SVGWeb dynamisch mit JQuery

<svg width="200" height="200" style="background-color:#D2B48C; margin-bottom:5px;" id="embeddedSVG"> 
<g id="myGroup" fill="blue" style="font-size:18px; text-anchor:middle; font-family: serif;"> 
<circle id="myCircle" cx="100" cy="75" r="50" stroke="firebrick" stroke-width="3" /> 
<text x="100" y="155">Hello World</text><text x="100" y="175">From Embedded SVG!</text> 
</g></svg>

für IE zu empfangen, ich bin mit SvgWeb. Mein Problem ist, um Svg Inhalt anzuzeigen, muss ich es in eine <script type="image/svg+xml"></script> Tag-Kombination einbinden. Meine Herausforderung ist, dass die SVG asynchron über JQuery zurück gezogen wird. Und meines Wissens kann ich ein "Skript" -Tag nicht dynamisch aus JavaScript schreiben.

Wie nehme ich den SVG-Inhalt, der mit JQuery abgerufen und dynamisch angezeigt wird?

Quelle

2010-10-07 user462166

Ich habe die gleiche Sache schon gefragt. .. hoffentlich hat das jemand herausgefunden. – awesomo

Übrigens besteht das Problem nicht darin, das '

Sie können jQuery SVG plugin verwenden Die offizielle Website ist down, aber stochern Sie nach instructions.

Der relevante Teil ist, dass Sie fragen Antwort in diesem Abschnitt, glaube ich ..

load (url, Einstellungen) dieser Wrapper lädt ein externes SVG-Dokument. Beachten Sie, dass der Browser Ihnen möglicherweise nicht erlaubt, Dokumente von anderen Seiten als dieser der ursprünglichen Seite zu laden. Wenn kein Rückruf bereitgestellt wird und ein Fehler auftritt, wird die Fehlermeldung in dem SVG-Container angezeigt.

url (string) ist die Position des SVG Dokuments oder des aktuellen SVG Dokuments inline.

Einstellungen (boolean) sieht addTo unten oder (Funktion) siehe Beiladen unten oder (Objekt) zusätzliche Einstellungen für die Belastung mit Attributen unter:

addTo (boolean, optional) wahr zu hinzuzufügen, was schon da, oder falsch (Standardeinstellung) die Leinwand erste changeSize (boolean, optional) wahr zu ermöglichen, die Größe der Leinwand zu ändern oder false (Standard) zu behalten die ursprüngliche Größe Beiladen (Funktion zu löschen, optional) Rückruf nach hat das Dokument geladen, diese Funktion erhält das SVG-Wrapper-Objekt und eine optionale Fehlermeldung als Parameter, und darin befindet sich der SVG Container-Bereich.

svg.load('images/rect01.svg', 
    {addTo: true, onLoad: loadDone}); 
svg.load('<svg ...>...</svg>', loadDone);

auch für Kicks, hier einig PHP-Code ich so einen SVG in einer Schleifen-Anweisung einfügen verwendet, dass worked nicely ..

if (ICON_FILE_EXT == "svg") { 
     print "\<script\>svg.load(\'".ICON_PATH."/directory.svg\', \{addTo\: true, onLoad\: loadDone\}\)\;\<\/script\>";

Quelle

2011-06-14 20:14:58

Die SVG-Plugin mit SVGWeb unvereinbar zu sein scheint, oder zumindest wenn es in Flash rendert (was der Zweck von svgweb ist) – commonpike

Verwandte Themen