I want to make mid-line as red. But doing so makes all the lines red that are drawn after mid-line.
Following is my JavaScript code for making a graph in html5 Canvas:
var c = document.getElementById("myCanvas");// Accessing Canvas element
var graph = c.getContext("2d");
var posX = 100;
var posY = 50;
var finalX = posX;
var finalY = posY;
c.width = window.innerWidth; // To make canvas fullsize
c.height = window.innerHeight; // To make canvas fullsize
graph.strokeRect(100,50,1000,500)
while(finalY < 550)
{
finalY +=10;
graph.beginPath();
graph.moveTo(posX , finalY);
graph.lineTo(posX + 1000, finalY);
graph.stroke();
}
while(finalX <1100)
{
finalX += 10;
graph.beginPath();
graph.moveTo(finalX, posY);
graph.lineTo(finalX, posY + 500);
if(finalX == 600) // 600 is position for midline
{
graph.linewidth = 5;
graph.strokeStyle = "#ff0000";
}
graph.stroke();
}