Komma getrennt sind. Der Wert vor dem Komma ist der Horizontalversatz des Eckpunkts und der Wert hinter dem Komma der Vertikalversatz des Eckpunkts. Das Polygon wird automatisch geschlossen, indem der letzte Eckpunkt mit dem ersten verbunden wird. Mit drei Eckpunkten, wie im Beispiel, können Sie ein Dreieck erzeugen. Linie Mit markieren Sie eine Linie. Das x1 -Attribut gibt den Horizontalversatz des einen Eckpunkts der Linie an. Das y1 -Attribut gibt den Vertikalversatz des einen Eckpunkts der Linie an. Das x2 -Attribut gibt den Horizontalversatz des anderen Eckpunkts der Linie an. Das y2 -Attribut gibt den Vertikalversatz des anderen Eckpunkts der Linie an. Das stroke -Attribut gibt die Linienfarbe an. Das stroke-width -Attribut gibt die Linienstärke an. Bei allen numerischen Angaben von x - und y -Koordinaten können Sie auch bestimmte Maßeinheiten erzwingen. Beispiele: x="2.3cm" oder ry="47mm" . Erlaubt sind folgende Angaben: • px für Pixel (Defaulteinheit, wird verwendet, wenn keine andere Maßeinheit angegeben ist) • pt für Punkt (Maßeinheit aus der Typografie) • pc für Pica (Maßeinheit aus der Typografie) • mm für Millimeter • cm für Zentimeter • in für Inch (Zoll) • em relative Maßeinheit: aktuelle Schriftgröße • ex relative Maßeinheit: Höhe des Kleinbuchstabens x in der aktuellen Schriftgröße Umrisse und Füllungen Sie können Formen einfarbig füllen. Ferner können Sie die Umrisse der Formen gestalten. Beispiel
Bild 7.5: Einfache Umrisse und Füllungen in SVG Erläuterung Mit dem Attribut fill definieren Sie Füllfarben. Mit dem Attribut stroke können Sie die Umrissfarbe bestimmen und mit stroke-width die Umrissstärke. Bei Farbangaben gelten die gleichen Regeln wie für Farbwerte und Farbnamen in CSS. Möglich sind Angaben wie #DD6600 , rgb(50,50,200) , rgb(100%,80%,10%) oder powderblue . Farbverläufe Sie können gradiente oder radiale Farbverläufe bestimmen, welche auf Formen angewendet werden können. Beispiel
Bild 7.6: Einfache Farbverläufe in SVG Erläuterung Die Farbverläufe werden separat von den Formen zu Beginn des SVG-Dokuments in einem Bereich definiert, der durch …
markiert wird. Dieser Bereich dient dazu, Gestaltungselemente zu definieren, die dann von Formen referenziert werden können. Mit …
definieren Sie einen linearen Farbverlauf, also zum Beispiel von links nach rechts oder von oben nach unten. Mit …
definieren Sie einen radialen Farbverlauf, also beispielsweise vom Mittelpunkt zu den Rändern hin. In den Start-Tags von und notieren Sie jeweils ein id -Attribut. Diesen Attributen weisen Sie jeweils einen frei wählbaren Namen zu. Jeder id -Name darf innerhalb der SVG-Grafik nur einmal vorkommen. Um auch gleichfür den Script-Zugriff gerüstet zu sein, sollte der Name nur aus Buchstaben, Ziffern und Unterstrichen bestehen. Mit Attributen wie x1 , x2 , y1 und y2 definieren Sie Eckpunkte für den Farbverlauf. Es ist ratsam, dabei Prozentangaben zu verwenden. So bleiben die
Kostenlos Online Lesen 
