Canvas: Difference between revisions

Revision as of 15:55, 25 September 2012

The canvas tag was introduced by Apple and has been standardized to become part of HTML5.

Get the canvas tag:

c=document.getElementById("c")

Get the "context" (like a paper):

p=c.getContext("2d");

Draw something!

p.fillRect(0, 0, 100, 100);

@@ Line 1: / Line 1: @@
 The [[wikipedia:Canvas element|canvas]] tag was introduced by Apple and has been [http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html standardized to become part of HTML5].
-To use it, you add the canvas tag to your HTML page, then use javascript draw on it.
-<canvas id="canvas" showsrc>
+Get the canvas tag:
-function draw() {
-  c = document.getElementById("canvas");
-  p = c.getContext("2d");
-  p.fillRect(50, 50, 150, 150);
-}
-</canvas>
-== Loop ==
+ c=document.getElementById("c")
-== Template ==
+Get the "context" (like a paper):
+ p=c.getContext("2d");
+Draw something!
+ p.fillRect(0, 0, 100, 100);
-x
 == Links ==