在画布内部保留KineticJS形状

Question

当使用KineticJS的拖动功能时，是否有一种简单的方法可以确保您的形状保持在画布内？

标准，形状会离开画布，直到您的鼠标碰到画布边框。我希望这是形状边框，而不是鼠标。

有没有办法做到这一点？

Answer 1

使用dragBoundFunc在KineticJS tutorial

说明这里有一个JS fiddle

，代码：

dragBoundFunc: function(pos) { 
    console.log(bbox.getWidth()); 
    var xBound = stage.getWidth() - bbox.getWidth(); 
    var yBound = stage.getHeight() - bbox.getHeight(); 

    // Check X boundries 
    if (pos.x > xBound) { 
     var newX = xBound; 
    } else if (pos.x <= 0) { 
     var newX = 0; 
    } else { 
     var newX = pos.x; 
    } 

    // Check Y boundries 
    if (pos.y > yBound) { 
     var newY = yBound; 
    } else if (pos.y <= 0) { 
     var newY = 0; 
    } else { 
     var newY = pos.y; 
    } 

    return { 
     x: newX, 
     y: newY 
    }; 
}