Ich verstehe es nicht. Ich kopiere ein anderes Bild/Symbol und es ist auch kaputt, aber der base64-Code hat kein “=” jsfiddle.net/TYb59 Ist die Seite flatIcon.com so fehlerhaft?
Kann ich diese Bilder/Symbole reparieren?
Ich würde empfehlen, das Bild herunterzuladen, es selbst hochzuladen und in den Link einzufügen.i.imgur.com/fqAsZoj.png”> Ich habe es für dich getan
Der von Ihnen kopierte base64-Code ist fehlerhaft. Kurz vor dem Ende gibt es == in der Mitte des Codes. Das ist ein Füller, der am Ende eines base64-Codes platziert wird.
Entfernen Sie das Teil danach ==und es wird gut funktionieren.
Das Herunterladen der SVG-Datei von der Website und die Base64-Codierung führt zu genau demselben Ergebnis. Wenn es keine Signatur gibt, mit der Sie den Code einfach reparieren können, müssen Sie dies tun.
Ich habe C#-Code wie diesen verwendet, um das Bild base64 in eine Textdatei zu codieren:
Ich verstehe es nicht. Ich kopiere ein anderes Bild und es ist auch kaputt … aber der base64-Code hat kein “=” jsfiddle.net/TYb59 Ist die Seite flatIcon.com so fehlerhaft?
– Petrus
23. Juni 2014 um 5:39 Uhr
@ Peter: Vielleicht ist es das. Der base64-Code hat nur = oder == am Ende, wenn die Anzahl der Bytes nicht ohne Rest durch drei teilbar ist. Ohne sie gibt es keine einfache Möglichkeit festzustellen, ob der Code abgeschnitten oder mit Müll angehängt wurde. Wenn Sie mir den Link zu dieser Seite geben, könnte ich die SVG-Datei abrufen und sie mit Base64 codieren, um zu sehen, was sie sein sollte.
– Gufa
23. Juni 2014 um 12:36 Uhr
Als SVG-Datei herunterladen und in base64 codieren. Funktioniert! Vielen Dank!
– Petrus
24. Juni 2014 um 0:46 Uhr
Sie könnten einen Icon-Anbieter verwenden, der über ein CDN wie iconrequest.com verfügt
– Lewis Quaife
20. Januar 2018 um 18:35 Uhr
HINWEIS: Es ist wichtig, dass der base64-Code enthält +xml nach dem svg Teil.
– Vincent Hoch-Drei
1. Juli 2019 um 9:34 Uhr
Also, nachdem ich ein paar Dinge ausprobiert hatte (ich musste SVG wirklich als src=”https://stackoverflow.com/questions/24337271/data:”) anzeigen. Ich bin auf ein paar wichtige Punkte gestoßen:
Sie müssen es nicht als Base64 codieren, es kann reines SVG verwendet werden, das macht es viel besser lesbar und sowohl in der Länge als auch nach gzip kleiner. Es ist auch viel einfacher zu testen/debuggen/bearbeiten.
es ist zwingend die zu haben xmlns Attribut in der svg -Tag unabhängig davon, ob Sie base64 oder utf8 verwenden. Das war das Stück, das mir am meisten entgangen ist.
Hallo @mateuscb, gemäß Ihrer obigen Lösung brauche ich Ihre Hilfe im Detail. Ich möchte ein Bildelement auch in SVG hinzufügen. Hier ist, was ich möchte: w3.org/2000/svg’> overflow=’sichtbar’ enable-background=’neu’ width=’50’ height=’50’ xlink:href=’mdn.mozillademos.org/files/6457/… x1=’0′ y1=’0′ x2=’200′ y2=’200′ style=’stroke:rgb(255,0,0);stroke-width:2′ />” /> Bitte Hilfe Danke
Sie können direkt in das HTML einfügen. Es ist einfach, keine dummen langen Schlangen und scheint zuverlässiger zu funktionieren. Bei alten Browsern bin ich mir nicht sicher, aber nur Verrückte verwenden alte Browser. Kann Breiten- und Höhenparameter im SVG-Tag hinzufügen.
– Jim Birke
19. August um 4:44 Uhr
@jimbirch das stimmt, aber in vielen Fällen (so war es in meinem) haben Sie die Aufgabe, vom Benutzer hochgeladene Inhalte zu rendern. Es gibt auch viele Möglichkeiten, dies zu tun, aber wir fanden, dass dies für unseren Fall am besten ist. Aber eine gute Erinnerung daran, dass Sie, wenn Sie das HTML besitzen, einfach
– mateuscb
21. August um 17:58 Uhr
Ich hatte heute ein ähnliches Problem und bin zu folgendem Ergebnis gekommen:
Verwendung der <embed> etikettieren wie beschrieben hier hatte die beste Kompatibilität zu den getesteten Browsern (Firefox, Safari, Chrome auf Mac OS). Der obige Code würde wie folgt geschrieben:
am Ende fügst du hinzu ==5324e483b5f25ab4badb7c52c102103e – das hatte falsche Daten!
Daher rate ich Ihnen, ein Tool zu verwenden, um Bilddaten korrekt in Base64-Strings zu konvertieren. wie in https://www.base64encode.org/ und alles wird gut!
Ich würde empfehlen, das Bild herunterzuladen. Laden Sie es selbst hoch und setzen Sie es mit dem Link. Schau dir meinen Kommentar oben an. Ich darf jsfiddle nicht posten..
…bei der Messung der Leistung von Hunderttausenden von mobilen Seitenaufrufen, dass das Laden von Bildern mit einem Daten-URI im Durchschnitt 6x langsamer ist als mit einem binären Quelllink wie einem img-Tag mit einem src-Attribut!
– Petrus
21. Juni 2014 um 1:07 Uhr
Das ist richtig! Daran gibt es keinen Zweifel
– Mondkopf
21. Juni 2014 um 1:24 Uhr
…bei der Messung der Leistung von Hunderttausenden von mobilen Seitenaufrufen, dass das Laden von Bildern mit einem Daten-URI im Durchschnitt 6x langsamer ist als mit einem binären Quelllink wie einem img-Tag mit einem src-Attribut!
– Petrus
21. Juni 2014 um 1:07 Uhr
Das ist richtig! Daran gibt es keinen Zweifel
– Mondkopf
21. Juni 2014 um 1:24 Uhr
14301800cookie-checkBase64/SVG-HTML-Bild wird nicht angezeigtyes
Ich würde empfehlen, das Bild herunterzuladen, es selbst hochzuladen und in den Link einzufügen.
i.imgur.com/fqAsZoj.png”> Ich habe es für dich getan
– Mondkopf
21. Juni 2014 um 0:57 Uhr
jsfiddle.net/fKt8G
– Mondkopf
21. Juni 2014 um 1:04 Uhr