HTML5-Tutorium: Canvas: Hello World 01: Unterschied zwischen den Versionen
Kowa (Diskussion | Beiträge) |
Kowa (Diskussion | Beiträge) |
||
| Zeile 23: | Zeile 23: | ||
==Quellen== | ==Quellen== | ||
<references/> | <references/> | ||
<ol start =" | <ol start ="4"> | ||
<li> {{Quelle|Kowarschick, W.: Multimedia-Programmierung}}</li> | <li> {{Quelle|Kowarschick, W.: Multimedia-Programmierung}}</li> | ||
<li> http://www.html5canvastutorials.com/tutorials/html5-canvas-element/ HTML5 Canvas Text Tutorial]</li> | <li> http://www.html5canvastutorials.com/tutorials/html5-canvas-element/ HTML5 Canvas Text Tutorial]</li> | ||
</ol> | </ol> | ||
==Siehe auch== | ==Siehe auch== | ||
* {{SieheAuch|Pilgrim (2011)}} | * {{SieheAuch|Pilgrim (2011)}} | ||
Version vom 26. Oktober 2016, 13:01 Uhr
Dieser Artikel erfüllt die GlossarWiki-Qualitätsanforderungen:
| Korrektheit: 4 (großteils überprüft) |
Umfang: 4 (unwichtige Fakten fehlen) |
Quellenangaben: 5 (vollständig vorhanden) |
Quellenarten: 5 (ausgezeichnet) |
Konformität: 4 (sehr gut) |
HTML-Tutorium Hello World: JavaScript | Canvas | SVG
Musterlösung: index.html
(SVN-Repository)
Der Canvas
In HTML5 wurde das Canvas-Element eingeführt.[1] Dieses Element stellt in einem HTML-Dokument eine „Bühne“ zur Verfügung, die mit Pixeldaten (Bitmaps) gefüllt werden kann. Es gibt diverse Möglichkeiten Bitmaps zu erzeugen. Vom W3C wurde bislang lediglich der 2D-Context[2] standardisiert. Mit WebGL steht allerdings eine weitere Canvas-API zur Verfügung. Mit ihr ist es möglich, 3D-Rendering auf Basis von OpenGL in einem Canvas-Element durchzuführen.[3]
Use Cases
Wie im ersten und zweiten Teil des Hello-World-Tutoriums soll die ganze Welt begrüßt werden.
Allerdings erfolgt die Ausgabe diesmal mit Hilfe eines Canvas-Elements.
Erstellen eines neuen Projektes
Erstellen Sie ein neues Projekt „HelloWorldCanvas01“.
Kopieren Sie anschließend die Dateien „index.html“ und „main.css“
aus dem zweiten Teil des Tutoriums und passen Sie den Titel in der HTML-Datei an.
Quellen
- Kowarschick (MMProg): Wolfgang Kowarschick; Vorlesung „Multimedia-Programmierung“; Hochschule: Hochschule Augsburg; Adresse: Augsburg; Web-Link; 2018; Quellengüte: 3 (Vorlesung)
- http://www.html5canvastutorials.com/tutorials/html5-canvas-element/ HTML5 Canvas Text Tutorial]
Siehe auch
- Pilgrim (2011): Mark Pilgrim; Canvas – Dive Into HTML5; http://diveintohtml5.info/; 2011; Quellengüte: 2 (Web)
- w3schools.com: HTML5
- HTML Living Standard
Fortsetzung des Tutoriums
Sie sollten nun Teil 2 des Tutoriums bearbeiten.
