使用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是你的音符元素。