Caricamento SVG in SVGWeb dinamicamente con JQuery

Sto tentando di visualizzare dinamicamente alcuni contenuti SVG. Questo contenuto è memorizzato come una stringa nella mia fonte di dati. Una stringa di esempio potrebbe essere simile al seguente:Caricamento SVG in SVGWeb dinamicamente con 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>

per ospitare per IE, sto usando SvgWeb. Il mio problema è, per visualizzare il contenuto svg, ho bisogno di avvolgerlo in una combinazione di tag <script type="image/svg+xml"></script>. La mia sfida è che lo svg viene ritirato in modo asincrono tramite JQuery. E, per quanto ne so, non posso scrivere dinamicamente un tag 'script' da JavaScript.

Come si preleva il contenuto SVG recuperato con JQuery e visualizzato in modo dinamico?

fonte

2010-10-07 user462166

mi sono chiesto la stessa cosa. .. speriamo che qualcuno lo abbia capito. – awesomo

A proposito, il problema non è generare dinamicamente il tag '

È possibile utilizzare jQuery SVG plugin Il sito Web ufficiale è inattivo, ma si aggira per instructions.

La parte rilevante si sta chiedendo è la risposta in questa sezione, credo ..

carico (url, impostazioni) questo wrapper carico un documento SVG esterno. Notare che il browser potrebbe non consentire il caricamento di documenti da siti diversi da quello della pagina originale. Se non viene fornita alcuna richiamata e si verifica un errore, il messaggio di errore viene visualizzato nel contenitore SVG .

url (stringa) è la posizione del documento SVG o del documento SVG reale in linea.

impostazioni (booleana) vedi addto sotto o (funzione) vedi onLoad sotto o (oggetto) impostazioni aggiuntive per l' carico con gli attributi di seguito:

addto (booleano, opzionale) veri a aggiungere a ciò che è già lì, o false (default) per cancellare la tela primo changeSize (boolean, opzionale) true per consentire le dimensioni del quadro di modificare o false (predefinito) per mantenere la dimensione onLoad originale (funzione, opzionale) richiamata dopo il documento è stato caricato, questa funzione riceve l'oggetto wrapper SVG e un messaggio di errore opzionale come parametri, e all'interno del quale si trova la divisione contenitore SVG .

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

anche, per i calci, ecco alcune codice PHP che ho usato per inserire un tale SVG in una dichiarazione looping, che worked nicely ..

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

fonte

2011-06-14 20:14:58

Che SVG plug-in sembra essere incompatibile con SVGWeb, o almeno quando esegue il rendering in flash (che è lo scopo di svgweb) – commonpike

Problemi correlati