HTML5 Canvas - Different Strokes

Question

I have to draw a graph with 3 different lines. A line graph.

I tried doing this:

function draw() 
{  
    var canvas = document.getElementById(\"canv         


        

Answer 1

Although there is a functional answer here, I'd just like to add this.

var ctx1 = canvas.getContext("2d");
var ctx2 = canvas.getContext("2d");
var ctx3 = canvas.getContext("2d");

They all refer to the same object. It does not create a new context, it uses the one that's already attached to the canvas element. Delta is totally right in saying that it strokes yellow over the entire path because you did not begin a new path. ctx.beginPath() will solve your troubles.