javascript - 使用 fabric.js 移动元素时如何将图像保持在 Canvas 的背面？

Question

我最初将一张大图像加载到我的 Canvas 中，然后我希望能够在其上绘制矩形。当我四处拖动图像时，我仍然希望矩形出现在图像上方，而不是将它们推到后面。

这是一个小插曲；

http://plnkr.co/edit/iJV0bZrlCG4CJXlhDw8w?p=preview

如果可能的话，我希望能够保证不管怎样，图像总是在后面？我环顾四周很广泛，找不到解决方案。它变得越来越令人沮丧!

本来以为就这么简单；

canvas.on('object:moving', function(e) {

  var obj = e.target;
  console.log(obj.id)
  if (obj.id === 'img') {
    canvas.sendToBack(obj)
  } else {
    canvas.bringToFront(obj)
  }


});

希望有人能帮忙!

Answer 1

只要传入preserveObjectStacking选项，选中的东西就不会跳到最前面。

window.canvas = new fabric.Canvas('c', { preserveObjectStacking:true });