Project 5 - Javascript III - Part D

  1. Login to your W3 Schools Spaces account and open your project5.html file.
  2. Create a custom function that contains all the line drawing code.
  3. Make it so your custom function accepts 2 arguments. The first argument that sets the line color for each line, and the 2nd argument that sets the VERTICAL STARTING position for each line. For example:
    • context.moveTo(25,50); //line 1
    • context.moveTo(25,120); //line 2
    • context.moveTo(25,190); //line 3
  4. Call your custom function 4 times, once for each line, and be sure to pass in different arguments, so that each line has its' own color and vertical starting position.
  5. Instead of someone clicking on the canvas, create a button that says 'Draw Lines !' that will call your custom function four times on a single click.

Congratulations! You have now completed your Javascript III project.