FabricJS Canvas，滚动父容器移动子命中区域

Question

我正在使用FabricJS来创建一个应用程序。我发现滚动父div /容器会将对象的可选区域偏移到与滚动量直接相关的右侧。

所以，如果我有一个1200x600的画布和600x600的容器div，我在400,120那个画布上加一个矩形;当我滚动200px时，我无法点击矩形来选择它。相反，我必须将我的鼠标移动到600,120（空白空间）以获得横杆并选择矩形。

不确定这是否已知或有解决方法 - 但我将不胜感激。

Answer 1

您必须修改FabricJs代码才能使其正常工作。 问题出在getPointer函数中，如果你在all.js中搜索它，你会发现kangax的评论“这个方法需要修复”。

解决方法可以用

替换此函数

function getPointer(event) {
    // TODO (kangax): this method needs fixing
    return { x: pointerX(event) + document.getElementById("container").scrollLeft, y: pointerY(event) + document.getElementById("container").scrollTop };
}

其中“container”是画布的包装div。这不好，因为你必须输入确切的id，但它确实有效。

希望这有帮助。