0

嗨，伙计们，我正在研究一种用 Canvas 用鼠标绘制的方法。这是我有多远：

function drawdraw(){
    test = document.getElementById('test');
    ctx = test.getContext('2d');

    window.addEventListener("mousemove", drawing,false);
}

function drawing(e){
    ctx.clearRect(0,0,500,200);
    var xPos = e.pageX-test.offsetLeft;
    var yPos = e.pageY-test.offsetTop;
    ctx.fillRect(xPos, yPos,30,30);
}
window.addEventListener("load", drawdraw,false);

我目前的问题是我没有正确的光标坐标。我试过 e.clientX ， e.clientX 和上面的例子。

我希望能够动态移动我的画布，并且我希望鼠标的坐标在画布的左上角为 0,0，在画布的右下角为 500,200。换句话说，我只希望我的坐标在画布内，而不是页面的坐标。任何人？:)

顺便提一句。我对 javascript 解决方案感兴趣，所以如果可以的话，我想避免使用 jQuery。

4

1 回答 1

1

test is a local variable of function drawdraw and you are using it also in drawing function. You need to declare it as global variable.

于 2013-02-16T14:55:05.070 回答