Wie kann ich dieses aus dem Internet heruntergeladene SVG-Bild analysieren?

Während ich mir einige Designs einiger Websites ansah, stieß ich auf einen wunderschönen SVG-Hintergrund:

https://www.algolia.com/lp/img/hero/hero-magento.svg

Ich wollte es überprüfen, also habe ich es heruntergeladen. Auf keinen Fall möchte ich es für meine eigenen Werke verwenden. Ich möchte nur sehen, wie es technisch gemacht wird, damit ich vielleicht die gleiche Technik verwenden kann.

Sobald ich es jedoch in Inkscape öffne, sehe ich nicht das Originalbild, sondern nur den blauen Hintergrund:

Geben Sie hier die Bildbeschreibung ein

Warum erscheint der blaue Hintergrund, wenn ich es mit Inkscape öffne? Wie kann ich es anzeigen, wie ich es im Browser sehe? Gibt es einen Schutz, den ich nicht kenne? Wenn ja, wie funktioniert es? (Vielleicht kann ich es auch für meine eigenen SVG-Dateien verwenden ...)

Ich wiederhole, ich will nichts stehlen; Ich möchte nur einen Blick darauf werfen und sehen, wie es gemacht wird, etwas Neues zu lernen.

Stellen Sie sicher, dass Sie die letzte InkScape-Version installiert haben
Ich werde es jetzt überprüfen, sehen Sie es auf Ihrem Inkscape richtig?

Antworten (2)

Ich könnte das Muster auf diese Weise sichtbar machen:

  • Ich habe das SVG in Inkscape 0.92.4 geladen und nur diese dunkelblaue Hintergrundform gesehen.
  • Ich habe die Ansicht auf Gliederung eingestellt. Das machte die Formen sichtbar.
  • Inkscape sagte, die Zeichnung sei eine Gruppe von zwei Objekten, also habe ich alles ausgewählt und die Gruppierung aufgehoben.
  • Inkscape sagte, dass die unregelmäßigen Formen eine Gruppe von 5 Objekten waren, die in der Wurzel maskiert waren .
  • Ich entfernte die Maske und löste die Gruppierung auf.
  • Die regelmäßige Form lag offensichtlich vor den unregelmäßigen, also schickte ich sie nach hinten.

Und jetzt war alles in Ordnung.

Ich danke Ihnen für Ihre Erklärung. Es funktionierte!

Analysieren von SVG-Dateien

SVG-Dateien sind endlich reiner Text. Eine Person, die das Denken und Wissen eines Programmierers hat, kann es zum Beispiel lesen. mit Texteditor. Ich überspringe es.

Den SVG-Code zu analysieren und zu wissen, wie verschiedene Anwendungsprogramme den Code interpretieren, ist der einzige Weg, ihn richtig zu verstehen. Die Überprüfung des Layer- und Objektstrukturbaums in einem Grafikprogramm ist keine primäre Information, sondern wird bereits einmal interpretiert.

Inkscape, Affinity Designer und Illustrator haben Ihre Datei in ihren Ebenen- und Objektfeldern alle unterschiedlich dargestellt. Sie haben es auch anders wiedergegeben. Inkscape hat nur ein dunkles verzerrtes Rechteck wie in Ihrem Screenshot erstellt, andere zeigen auch einige blaue Formen, aber anders.

Überprüfen Sie es im Objektbereich von Inkcape. Es hat eine obskure Gruppierung. Entfernen Sie es mit Extension > Arrange Deep Ungroup. Die gewünschte Färbung wird sichtbar, aber die Schnittmaske verschwindet.

Nach dem Aufheben der Gruppierung enthält Ihr Bild mit Farbverläufen gefüllte, teilweise transparente Pfade und einen Pfad mit durchgehender Füllung.

Die Struktur scheint einfach, aber die Verlaufsfüllung ist irgendwie an der ursprünglichen Gruppenplatzierung fixiert, sie bewegt sich nicht, wenn man die mit Verlauf gefüllten Formen bewegt. Das Neudefinieren des Farbverlaufs in Inkscape korrigiert ihn. Das Aufheben der Gruppierung hat das Bild nicht richtig repariert.

Ich wette, Sie haben etwas gefunden, das in den SVG-Spezifikationen mehrdeutig definiert ist. Dies ist nur eine Vermutung eines Nicht-Programmierers.

Wie kann ich dieses aus dem Internet heruntergeladene SVG-Bild analysieren?
AntwortenHierDatenschutz-Bestimmungen1y, 0v