Effekte

Effektvolle Beispiele auf Canvas-Basis sind bei [10] zu finden. Sie beweisen, dass sich auf aktuellen Rechnern auch bei komplexen optischen Effekten noch Frame-Raten für fließende Animationen erzielen lassen. Weitere Javascript-Bibliotheken, die den Umgang mit dem Canvas erleichtern, nennt Tabelle 1.

Der HTML-Canvas gleicht einem Malprogramm wie Gimp: Wie in einer Bitmap-Grafik lassen sich Bildbereiche auswählen und verändern. Soll ein von anderen Objekten überdecktes Element verändert werden, so ist daher der ganze betroffene Bildausschnitt neu zu zeichnen.

Wer mit einem Vektorzeichenprogramm wie Inkscape vertraut ist, der weiß, dass dies dort einfacher geht: Alle gezeichneten Formen bleiben unabhängig von der Umgebung manipulierbar. Wer das Vektorprinzip dem Canvas-Malkasten vorzieht, realisiert es in HTML 5 über direkt in den Seitencode eingebundene SVG-Grafiken. Das vom W3C standardisierte Dateiformat [11] ist auch deshalb von Vorteil, weil Programme wie Inkscape es als Standard benutzen.

Bewegende Künste

Mit statischen Grafiken sind die Möglichkeiten von SVG aber noch lange nicht ausgeschöpft: Der Browser kann das XML-Markup mit der eingebauten DOM-Schnittstelle von Javascript aus ansprechen – genau wie die Elemente einer gewöhnlichen Webseite. So lassen sich SVG-Grafiken im Browser interaktiv gestalten und animieren. Wie in HTML-Seiten legen Stylesheets die Attribute der Zeichnungselemente fest.

Ältere Browser (vergleiche Tabelle 2) zeigen SVG-Grafiken nur an, wenn sie über den »object« -Tag als externe Dateien eingebunden sind. Auch Javascript-Code für Manipulation zur Laufzeit muss in dieser externen Datei stehen, was die Entwicklung verkompliziert, die interaktiven Fähigkeiten aber nicht beschränkt.

Mit der SVG-1.1-Spezifikation hat das W3C einen enorm leistungsfähigen Standard für Vektorgrafiken geschaffen, der Adobes PDF-Format mit seinen Effektfiltern stellenweise überflügelt: Damit lassen sich realistische Schlagschatten, aber auch viele Licht- und Überblendungseffekte erzeugen, bei denen PDF auf eingebettete Bitmaps mit fester Auflösung angewiesen bleibt.

Als erste Anlaufstelle für Einsteiger eignet sich [12], etwas mehr in die Tiefe geht [13]. Tabelle 3 zeigt eine Liste der Grundfunktionen.