Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

--- faecher:informatik:oberstufe:codierung:bilder:sgv:start [27.09.2022 14:55] – sbel
+++ faecher:informatik:oberstufe:codierung:bilder:sgv:start [Unbekanntes Datum] (aktuell) – gelöscht - Externe Bearbeitung (Unbekanntes Datum) 127.0.0.1
@@ Zeile 1: / Zeile 1: @@
-====== SVG-Grafiken ======
-Das Scalable Vector Graphics-Format (SVG-Format) ist ein Vektorgrafikformat. Es verwendet geometrische Objekte wie Strecken und Kreise zur Speicherung und Darstellung eines Bildes.
-Die SVG-Syntax ist nach XML-Regeln aufgebaut, d.h. es kommen Tags ähnlich wie in HTML zum Einsatz, um Bildinformationen zu speichern. Zum Erstellen von SVG-Bildern eignet sich ein Texteditor, zum Betrachten ein aktueller Browser.
-Im Grundgerüst einer SVG-Datei werden Breite und Höhe der Zeichenfläche festgelegt. Gehen Grafiken über die Zeichenfläche hinaus, werden sie nicht dargestellt.
-<code>
-<svg xmlns="http://www.w3.org/2000/svg" width=..." height="...">
-</svg>
-</code>
-Das SVG-Koordinatensystem hat seinen Ursprung in der linken oberen Ecke des Browsers, wobei die x-Werte nach rechts und die y-Werte nach unten hin zunehmen.
-Grafiken und Objekte können mittels bestimmter Tags auf der Zeichenfläche angezeigt werden, wobei ihre Reihenfolge eine Rolle spielt: So überlagern später im Quelltext definierte Grafiken früher definierte.
-Speichert man den Quelltext
-<code>
-<svg xmlns="http://www.w3.org/2000/svg" width="600" height="600">
-  <rect x="100" y="100" width="500" height="200" stroke="#0000FF"/>
-  <ellipse cx="350" cy="200" rx="100" ry="50" fill="#FF0000"/>
-  <text x="300" y="200" fill="#FFFFFF">SVG ist super!</text>
-</svg>
-</code>
-in einer Datei mit der Endung „SVG“ und öffnet man sie per Drag&Drop in einem Browser, so erscheint folgendes Bild:
-{{ :faecher:informatik:oberstufe:codierung:bilder:sgv:svgbild.png |}}