Canvas (HTML-Element)

Ein Canvas-Element (vom englischen für „Leinwand“ oder „Gemälde“) ist ein – in der Sprache HTML – mit Höhen- und Breiten-Angaben beschriebener Bereich, in den per JavaScript gezeichnet werden kann.<ref> In: Ehemals im Vorlage:Referrer (nicht mehr online verfügbar); abgerufen  </ref> Ursprünglich von der Firma Apple als Bestandteil des WebKit entwickelt, ist es später von der Arbeitsgruppe WHATWG als Bestandteil der Auszeichnungssprache HTML5 standardisiert worden.

Fähigkeiten

Datei:HTML5 Canvas referenz.png

Canvas-Referenzkarte

Neben normalen Linien- und Rechteckszeichenfunktionen ermöglicht Canvas unter anderem das Zeichnen von:

• Kreisbögen
• Bézierkurven (quadratisch und kubisch)
• Farbverläufen
• Grafiken (Formate: PNG, GIF, JPEG), die skaliert, positioniert und beschnitten werden können
• Transparenz (mit mehreren Abstufungen)
• Text

Objekte und Objektgruppen können verschoben, rotiert und skaliert werden.

Wie bei OpenGL und DirectX auch können Objekte in einem Stack abgelegt werden, was die gezielte Manipulation von Objektgruppen ermöglicht. Animationen sind mittels Verwendung von JavaScript-Zeitfunktionen möglich.

Die Ausgabe von Vektorgrafik wird nicht unterstützt.

Unterstützung

Canvas wird von aktuellen Browsern nativ unterstützt.<ref>Vorlage:Cite book/Name: [ ] , archiviert vom Vorlage:Referrer (nicht mehr online verfügbar) am Vorlage:Cite book/URL; abgerufen (). Vorlage:Cite book/URLVorlage:Cite book/MeldungVorlage:Cite book/Meldung2Vorlage:Cite book/MeldungVorlage:Cite book/MeldungVorlage:Cite book/MeldungVorlage:Cite book/MeldungVorlage:Cite book/Meldung</ref>

Microsofts Internet Explorer unterstützt Canvas ab Version 9. Alte Versionen können jedoch mit Plugins, welche von Mozilla und Google zur Verfügung gestellt werden, um die Canvas-Funktion erweitert werden.<ref>Vorlage:Cite book/Name: [ ] Ars Technica, , archiviert vom Vorlage:Referrer (nicht mehr online verfügbar) am Vorlage:Cite book/URL; abgerufen (). Vorlage:Cite book/URLVorlage:Cite book/MeldungVorlage:Cite book/Meldung2Vorlage:Cite book/MeldungVorlage:Cite book/MeldungVorlage:Cite book/MeldungVorlage:Cite book/MeldungVorlage:Cite book/Meldung</ref><ref>Vorlage:Cite book/Name: [ ] Sourceforge, , archiviert vom Vorlage:Referrer (nicht mehr online verfügbar) am Vorlage:Cite book/URL; abgerufen (). Vorlage:Cite book/URLVorlage:Cite book/MeldungVorlage:Cite book/Meldung2Vorlage:Cite book/MeldungVorlage:Cite book/MeldungVorlage:Cite book/MeldungVorlage:Cite book/MeldungVorlage:Cite book/Meldung</ref>

Siehe auch

• Canvas Fingerprinting

Weblinks

• Offizielle Canvas-Beschreibung (englisch)
• Einführung in Canvas
• Ausführliches Canvas-Tutorial bei Mozilla.org (englisch)
• canvas.quaese.de – Dokumentation, Einleitungen mit Beispielen, weiterführende Links

Einzelnachweise

<references />