使用HTML5和JavaScript在可拖動畫布上繪製

Question

我目前正在創建後期註釋。您可以通過按鈕添加筆記。 你可以點擊那些筆記，當你想繪製它們。

問題是，當我想在畫布上畫畫時，我只能在畫布的左上角進行畫布。我認爲上下文的註冊點存在問題。

當我拖動它時，如何讓上下文跟隨畫布？

Answer 1

得到補償你的元素的使用：

  function getOffset(el) { 
       var _x = 0; 
       var _y = 0; 
       while(el && !isNaN(el.offsetLeft) && !isNaN(el.offsetTop)) { 
        _x += el.offsetLeft - el.scrollLeft; 
        _y += el.offsetTop - el.scrollTop; 
        el = el.parentNode; 
       } 
       return { 
        top : _y, 
        left : _x 
       }; 
      } 

其中EL是你的注意元素。