I have an issue with my js code, I wanted to trace somes lines in a canvas, so I made a function named drawLine, in which you draw a line from a point (x,y) to a point (xdest,ydest). The first lines are correctly displayed but from the fourth, it doesn't work and I dont know why, do you have some ideas?
var canvas2 = document.getElementById("canvasMid");
var ctx = canvas2.getContext('2d');
ctx.fillStyle = color;
drawLine(ctx,(canvas.width/2),0,(canvas.width/2)-2,canvas.height,color, width);
drawLine(ctx,canvas.width/2,(1/5)*canvas.height,0,0,color,width);
drawLine(ctx,canvas.width/2,(1/6)*canvas.height,canvas.width,0,color,width);
//start of the code which doesn't work
drawLine(ctx,canvas.width/2,0.5*canvas.height,0,canvas.height,color,width);
console.log(canvas.width,canvas.height)
drawLine(ctx,canvas.width/2,(3/4)*canvas.height,canvas.width,canvas.height,color,width);
//end
}
function drawLine(ctx,x,y,xdest,ydest,color,width){
ctx.beginPath();
ctx.moveTo(x,y);
ctx.lineTo(xdest,ydest);
ctx.strokeStyle = color;
ctx.lineWidth = width;
ctx.stroke();
ctx.closePath();
}
1st line in the center;2nd line on the left;3rd line on the right
Could you be more specific?
Like adding some images of what does excite and mark the code that seems to be in a problem...
Thanks a lot;)
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.