SVG: Unterschied zwischen den Versionen

Aus KGS-Wiki
Keine Bearbeitungszusammenfassung
Keine Bearbeitungszusammenfassung
Zeile 1: Zeile 1:
'''Scalable Vector Graphics''' ist ein Bild-Dateiformat, welches statt mit Pixeln mit Linien arbeitet. Es basiert auf der Dateiform [[XML]].
'''Scalable Vector Graphics''' ist ein Bild-Dateiformat, welches statt mit Pixeln mit Linien arbeitet. Es basiert auf der Dateiform [[XML]].


Ein Vorteil des SVG-Formates gegenüber anderen Grafikformaten wie JPG oder PNG, insbesondere beim Arbeiten mit niedriger Datenverbindung, ist die Skalierbarkeit ohne Qualitätsverlust, gegenüber der Skalierbarkeit von pixel-basierten Rastergrafiken, deren Auflösung entsprechend des Pixel-Systems schlechter wird.
Ein Vorteil des SVG-Formates gegenüber anderen Grafikformaten wie JPG oder PNG, insbesondere beim Arbeiten mit niedriger Datenverbindung, ist die Skalierbarkeit ohne Qualitätsverlust, gegenüber der Skalierbarkeit von pixel-basierten [[Rastergrafik|Rastergrafiken]], deren Auflösung entsprechend des Pixel-Systems schlechter wird.
 
SVG-Bilder bestehen aus einer Reihe von Zeichen-Anweisungen, die von geeigneten Programmen, z.B. von den meisten [[Webbrowser|Webbrowsern]] in Zeichnungen umgesetzt werden können.
 
== Struktur eines SVG-Bildes ==
Eine SVG-Datei beginnt immer mit einem öffnenden <code><svg></code> und endet mit einem schließenden <code></svg></code>. Im öffnenden <code><svg></code> sollten zusätzlich noch die [[Attribut (Informatik)|Attribute]] <code>width</code> und <code>height</code> angegeben werden, die die Breite und Höhe des fertigen Bildes festlegen. Zu beachten ist die Schreibweise: eine Breite von 200 Einheiten wird als <code>width="200"</code> angegeben, wobei das Gleichheitszeichen und die Anführungszeichen wichtig sind.<syntaxhighlight lang="xml" line="1">
<svg width="100" height="100">
 
<!-- hierhin kommen die Zeichenanweisungen -->
 
</svg>
</syntaxhighlight>
 
== Zeichen-Anweisungen ==
Jede Anweisung gibt für ein grafisches Objekt vor, wie es zu zeichnen ist. Dabei gibt es Anweisungen für Standardformen wie Kreise und Rechtecke und die sehr mächtige Form <code>path</code>, die quasi jede vorstellbare Gestalt annehmen kann.
{{Lückenhaft|Zeichennweisungen}}

Version vom 2. Februar 2023, 19:14 Uhr

Scalable Vector Graphics ist ein Bild-Dateiformat, welches statt mit Pixeln mit Linien arbeitet. Es basiert auf der Dateiform XML.

Ein Vorteil des SVG-Formates gegenüber anderen Grafikformaten wie JPG oder PNG, insbesondere beim Arbeiten mit niedriger Datenverbindung, ist die Skalierbarkeit ohne Qualitätsverlust, gegenüber der Skalierbarkeit von pixel-basierten Rastergrafiken, deren Auflösung entsprechend des Pixel-Systems schlechter wird.

SVG-Bilder bestehen aus einer Reihe von Zeichen-Anweisungen, die von geeigneten Programmen, z.B. von den meisten Webbrowsern in Zeichnungen umgesetzt werden können.

Struktur eines SVG-Bildes

Eine SVG-Datei beginnt immer mit einem öffnenden <svg> und endet mit einem schließenden </svg>. Im öffnenden <svg> sollten zusätzlich noch die Attribute width und height angegeben werden, die die Breite und Höhe des fertigen Bildes festlegen. Zu beachten ist die Schreibweise: eine Breite von 200 Einheiten wird als width="200" angegeben, wobei das Gleichheitszeichen und die Anführungszeichen wichtig sind.

<svg width="100" height="100">

<!-- hierhin kommen die Zeichenanweisungen -->

</svg>

Zeichen-Anweisungen

Jede Anweisung gibt für ein grafisches Objekt vor, wie es zu zeichnen ist. Dabei gibt es Anweisungen für Standardformen wie Kreise und Rechtecke und die sehr mächtige Form path, die quasi jede vorstellbare Gestalt annehmen kann.

🕳
Lückenhaft

In diesem Artikel oder Abschnitt fehlen noch folgende wichtige Informationen:

Zeichennweisungen

Hilf dem KGS-Wiki, indem du sie recherchierst und einfügst.