画布绘制到不是绘制线

时间:2014-08-13 14:51:54

标签: javascript html5

我在javascript中构建了一个函数来绘制画布上的设定点。我的所有观点都正确地指望c。如果我尝试从任何点到c绘制一条线,它就不起作用。

的Javascript

var a = {x:0, y:0};
var b = {x:350, y:0};
var c = {x:0, y:350};
var d = {x:350, y:350};
var e = {x:100, y:100};
var f = {x:100, y:250};
var g = {x:250, y:250};
var h = {x:250, y:100};

function drawLine(a, b)
{
ctx.beginPath();
ctx.moveTo(a.x,a.y);
ctx.lineTo(b.x,b.y);
ctx.stroke();
}
drawLine(d, c);

为什么所有要点都有效?c ????

1 个答案:

答案 0 :(得分:2)

由此,我猜测画布的宽度和高度为350。

假设他们正在工作。它只是在边境上绘制。您正试图从{x:0, y:350}转到{x:350, y:350}。请注意两者的y如何350。这意味着它将从bottom,left角落到bottom,right角落,完全停留在y : 350,即边界。因此,你将无法看到它。

尝试将var c = {x:0, y:350};更改为var c = {x:0+5, y:350-5};,将其保留在{x:5, y:345}。你会注意到,对于点c,线条现在显示,但非常接近边界。