禁用对某些元素 Fabric.js 的平移

Question

我正在使用带有 react 的 Fabric.js，并且我在上面实现了一些工具。 这是它的外观：

但是有一个平移工具，我正在使用fabric 中的relativePan() 函数。我遇到的一个问题是使用平移工具拖动时标尺（标有红色）不应该移动。 它们也是画布的一部分，与其他所有元素一样。

有什么方法可以禁用某些元素的平移？我试过了：

lockMovementX
lockMovementY
selectable: false

Answer 1

诀窍是在平移时从静止物体中减去移动坐标：

canvas.on('mouse:move', function(e) {
  if (panning && e && e.e) {
    moveX = e.e.movementX;
    moveY = e.e.movementY;
    topRuler.set({
      top: topRuler.top - moveY,
      left: topRuler.left - moveX
    });
    leftRuler.set({
      top: leftRuler.top - moveY,
      left: leftRuler.left - moveX
    });
    canvas.relativePan(new fabric.Point(moveX, moveY));
  }
});

这是一个有效的 JSFiddle，https://jsfiddle.net/rekrah/z3p8utmc/。