01b Javascript drawing

Submitted by suryaismail on Thu, 01/25/2018 - 10:00

We'll expand a bit on Khan Academy's Drawing Basics, but instead of using the nice Khan Academy tool, we'll do it with just a text editor:

  1. Create a file on your computer called 'drawing.html'.  Now enter this code at the end of this document.
  2. Save the file and open it with your browser (chrome, firefox, explorer)
  3. Try experimenting with drawing other things




  <p>Draw something</p>

  <canvas id="myCanvas" width="400" height="300"
    style="border:1px solid #000000;">

  var canvas = document.getElementById('myCanvas');
  var ctx = canvas.getContext('2d');

  ctx.rect(10, 10, 30, 30);
  //ctx.ellipse(100, 100, 50, 75, 45 * Math.PI/180, 0, 2 * Math.PI);