HTML5 Canvas Tutorial Draw Lines and Filled Shapes Using Javascript




Homework Starter Code: http://www.developphp.com/video/HTML/Canvas-Draw-Lines-and-Filled-Shapes-Tutorial
In this HTML5 canvas lesson we demonstrate how to plot and draw lines for custom shapes. Learn to draw shapes, fill them, stroke them, color them, and complete the homework assignment laid out in the video.

Original source


28 responses to “HTML5 Canvas Tutorial Draw Lines and Filled Shapes Using Javascript”

  1. someone please explain to me why this does not work.<!DOCTYPE html>
    <html>
    <head>
    <title>Test</title>
    </head>
    <body>
    <canvas id="paper" width="300" height="500"></canvas>
    <script>
    window.onload=draw;
    function draw(){
    var paper=document.getElementById("paper")
    var ctx=paper.getContext("2d")
    ctx.rect(200, 200, 100, 60)
    ctx.fill("black")
    }
    </script>
    </body>
    </html>

  2. hola, oye una pregunta en la parte de al principio de tu video, mencionas algo acerca de de la l贸gica para crear figuras con el rat贸n?, la pregunta seria haz tratado o desarrollado un programa que dibujes lineas con el raton pero a la vez con esas lineas hagas figuras como cuadrados o poligonos y que a la vez los guardes?? como muestras al principio del video

  3. nope, just an ordinary pc calculator. I was gonna put the logic here but the video said not to post the answers here and ruin it for people. But since you already tried, I'm gonna pm the logic just for you, sorry flash.

Leave a Reply