English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

SVG-Tutorial

Das Ziel des HTML SVG-Tutorials ist es, Ihnen in kürzester Zeit den Einstieg in die Verwendung von SVG zu ermöglichen und dieses Tutorial auch später als schnelle Referenz zu verwenden. Hier werden so viele wie möglich und umfassendere SVG-Beispiele gegeben, um Ihnen zu helfen, SVG schnell zu beherrschen.

SVG-Einführung

SVG ist die Abkürzung für Scalable Vector Graphics. Es ist ein Grafikformat, bei dem Formen mit XML spezifiziert werden. Diese werden dann vom SVG-Viewer dargestellt. Heute können die meisten Webbrowser SVG anzeigen, genau wie sie PNG, GIF und JPG anzeigen können.
Internet Explorer 8und Benutzer von Versionen (und früher) mögen gezwungen sein, Adobe SVG Viewer zu installieren, um SVG im Browser anzuzeigen. IE 9 +, Chrome und Firefox unterstützen SVG nativ
SVG wird für zweidimensionale Vektorgraphiken verwendet
Wenn Sie unsicher sind, ob SVG für Sie oder Ihr Projekt geeignet ist, lesen Sie schnell die SVG-Beispiel-Seite durch, um die Funktionen von SVG schnell zu verstehen.

SVG-Online-Editor -  SVG kann online bearbeitet werden, und SVG kann in SVG-Quellcode umgewandelt werden

SVG-Beispiel大全  - Grundlegende SVG-Beispiele, die Ihnen helfen, SVG schnell vertraut zu machen

SVG Referenzhandbuch - Sammlung der häufig verwendeten SVG-Elemente und der Verwendungsmethoden ihrer Attribute

SVG wird für Vektorgraphiken verwendet

Als Vektorgrafikformat ist SVG besonders nützlich für Vektortypen Diagramme, wie zum Beispiel:

  1. Zweidimensionale Grafiken im X, Y-Koordinatensystem

  2. Spalten diagrams, Tortendiagramme usw.

  3. Erweiterbare Symbole und Logos für Web, Tablets und Mobile Apps sowie Web-Apps

  4. Baupläne und Designpläne

  5. usw.

Als „Vektorgrafik“-Format werden die zu zeichnenden Formen als Vektor oder ähnliche Vektorstruktur gespeichert. Mit anderen Worten, als digitale Daten. Nicht in Pixeln.

„Skalierbar“ bedeutet, dass Betrachter SVG-Bilder ohne Qualitätsverlust vergrößern oder verkleinern können. Dies ist möglich, weil die Grafiken als digitale Daten und nicht als Pixel definiert werden. Das Vergrößern oder Verkleinern von SVG-Bildern bedeutet nur, die Zahlen zu multiplizieren oder zu teilen, die die SVG-Formen definieren.

Obwohl Rastergrafiken in SVG-Bilder eingebettet werden können, ist SVG für照片, Filme und andere Rastergrafiken nicht die beste Wahl. Dies ist eine bequeme Methode, um Formen oder Text auf Rasterbildern zu zeichnen.

SVG ist besonders gut geeignet, Bilder zu erzeugen/Grafik/Diagramm

SVG ist ein XML-Format (Textformat) und lässt sich leicht aus Servlets, JSP, ASP.NET, PHP oder anderen Webanwendungstechnologien generieren. Dies macht SVG besonders geeignet für computergenerierte Grafiken und Diagramme. Es ist interessant, dass Sie in der Regel die für SVG am besten geeigneten Diagrammtypen (Grafiken, Diagramme, Diagramme usw.) genau generieren müssen, die SVG noch besser für die Erstellung von Grafiken und Diagrammen machen.

SVG-Skripte schreiben

SVG-Bilder, die im Browser generiert werden, können mit JavaScript geändert werden. Dies ermöglicht es, SVG für dynamischere Präsentationen und sogar kleine Spiele zu verwenden.

Über dieses Tutorial

Das Ziel dieses Tutorials ist es, Ihnen in kürzester Zeit den Einstieg in die Verwendung von SVG zu ermöglichen und dieses Tutorial auch später als schnelle Referenz zu verwenden. Es wird versucht, so viele SVG wie möglich zu behandeln, aber nicht jedes Punkt der SVG-Norm zu abdecken. Sobald Sie ein相当的了解基础知识,können Sie leicht die SVG-Norm für fortgeschrittene oder spezielle Themen überprüfen.