SVG-Daten-URI rendert nicht im img-Tag

Ich habe eine Base64 codierte Daten-URI-Zeichenfolge, die ich von einer Kendo-Map aus der Kendo.drawing.exportSVG-Methode erhalte.SVG-Daten-URI rendert nicht im img-Tag

Wenn ich die Base64-Zeichenfolge in einen SVG-Decoder, dann speichern Sie die resultierende SVG in eine Datei und öffnen Sie es in einem Browser das Bild zeigt gut, aber wenn ich es in ein <img> Tag einfügen, wird nichts angezeigt.

Die Base64-String ist ziemlich groß, also habe ich es in eine JsFiddle um es zu demonstrieren, anstatt hier einfügen.

https://jsfiddle.net/qmap5sg9/

Kann jemand raten, warum das Bild nicht geladen wird?

Quelle

2016-04-26 Steve

Ihre Daten URL besteht aus einer Menge von Verweisen auf fremde Bilder wie

<image preserveAspectRatio="none" x="310.15625" y="281" width="256px" height="256px" xlink:href="http://ecn.t0.tiles.virtualearth.net/tiles/r311213001300102.jpeg?g=5171&amp;mkt=en-US&amp;shading=hill" clip-path="url(#kdef7)" />

Wenn als Bild verwendet, in Ihrem Fall über eine Image-Tag der SVG aus einer einzigen Datei bestehen müssen, so werden Sie müssen jedes dieser Bilder als Daten-URLs codieren und dann, wenn Sie dies getan haben, die gesamte SVG-Datei als Daten-URL neu codieren.

Quelle

2016-04-26 06:35:27

Meinst du, jedes Bild kodieren, die in der SVG enthalten sind? – Steve

Hmm, ok. Ich denke, das ist der Grund, warum die Methode [ExportImage] (http://docs.telerik.com/kendo-ui/api/javascript/drawing#methods-exportImage) eine Daten-URI viel länger bereitstellt, sie muss das für mich tun. – Steve

Antwort

Verwandte Themen