HTML - Tags - <canvas>

#23 of 147
canvas

 <html>
 <body>
     <canvas id="canvas-demo" width="200" height="100">
     </canvas>
     <script>
         var canvas = document.getElementById("canvas-demo");
         var context = canvas.getContext("2d");
         context.moveTo(40, 10);
         context.lineTo(70, 10);
         context.lineTo(100, 100);
         context.lineTo(10, 100);
         context.lineTo(40, 10);
         context.fillStyle = "gray";
         context.fill();
         canvas.lineWidth = 0.5;
         context.strokeStyle = "navy";
         context.stroke();
     </script>
 </body>
 </html>
 

The canvas element creates a drawing surface that can be painted on using Javascript.

A live example:



N of

Ads by Google


Ask a question, send a comment, or report a problem - click here to contact me.

© Richard McGrath