Konvajs取消拖动事件

Question

我使用dragBoundFunc来限制拖动移动，但是在一定的距离内，我想取消拖动，这个想法是当用户试图移动到较远的位置时，对象会自动下降。

我尝试使用event.preventDefault()，但它不起作用。

我怎样才能做到这一点呢？

var image1 = new Konva.Image({
  image: imageObj,
  x: limit.left,
  y: limit.top,
  width: gBoxSize ,
  height: gBoxSize ,
  name: 'gameobj',
  draggable: true,

  dragBoundFunc: function(pos,event) {
      var newPos = {x: pos.x, y: pos.y};

      // if newPos exceeds 200px I want force to cancel the drag
      if(Math.abs(prevPos.x - newPos.x) > 200){
         // ?
      }

      if(newPos.x <= limit.left){
          newPos.x = limit.left;
      }else if(newPos.x >= limit.right){
          newPos.x = limit.right;
      }

      if(newPos.y <= limit.top){
          newPos.y = limit.top;
      }else if(newPos.y >= limit.bottom){
          newPos.y = limit.bottom;
      }

      // do some stuffs

      return newPos;
  }            
});

Answer 1

对于这种情况，您可以使用node.stopDrag()方法：

if(Math.abs(prevPos.x - newPos.x) > 200){
  image1.stopDrag();
}

但使用dragmove事件检查该条件并停止从中拖动可能会更好。