Scalable Vector Graphics (SVG)
Scalable Vector Graphics (SVG), deutsch Skalierbare
Vektorgrafiken, ist ein Standard zur Beschreibung zweidimensionaler Vektorgrafiken mit
XML. Ich mag SVG
unheimlich gerne. Auf Alphane Moon möchte ich meine Fortschritte beim
Erforschen und Kennenlernen dieser wunderbaren Sprache festhalten. Man kann so schöne grüne Grafiken mit SVG machen.
Einige Effekte und Animationen funktionieren bisher nur in sehr wenigen Browsern. Vor allem den Browser
Opera in der Version 9 kann ich sehr empfehlen.
Opera really rocks!
Hier ist eine nach Themen geordnete Sammlung aller Artikel, die ich bisher über Scalable Vector Graphics (SVG) geschrieben habe. Es werden hoffentlich noch sehr viele.
Gradients und Patterns
- Linear Gradients in SVG
- Radial Gradients in SVG (Coming soon!)
Clipping, Masking und Compositing
- Clipping mit clipPath (Coming soon!)
- Masking (Coming soon!)
Filter Effekte
- Dark Glow Visuals
Ein einfacher Glow-Effekt für SVG-Grafiken, der das Element
<feGaussianBlur> eingesetzt, um die Grafik zum Leuchten zu bringen.
Optische Täuschungen mit SVG
- Ouchi-Illusion mit SVG
Die Ouchi-Illusion ist eine optische Täuschung, benannt nach dem japanischen Künstler Hajime Ouchi.
Ich habe die Ouchi-Illusion mit SVG nachgebaut.
In einer animierten Version wird die Illusion noch viel deutlicher, sie funktioniert aber nur in Opera.
Fraktale und Iterierte Funktionen-Systeme (IFS) mit SVG
- Sierpinski-Dreiecke mit Scalable Vector Graphics
In diesem Artikel zeige ich, wie man Sierpinski-Dreiecke mit Scalable Vector Graphics konstruieren kann.
Tests, Versuche und Experimente
- Inline-SVG-Test für Browser
Ein kleiner Test mit einem giftgrünen Vektor-Smiley, der zeigt, ob ein Browser Vektorgrafiken darstellen kann, die
in XHTML eingebettet sind (Inline-SVG).
Ressourcen
- Linksammlung XML-Spezifikationen