javascript - KineticJSの形状をキャンバス内に保持する

Question

KineticJSのドラッグアンドドロップ機能を使用するときに、図形がキャンバス内にとどまるようにする簡単な方法はありますか？

標準では、マウスがキャンバスの境界に当たるまで、シェイプはキャンバスから少し離れます。マウスではなく、図形の境界線にしたいのですが。

それを実現する方法はありますか？

Answer 1

KineticJSチュートリアルdragBoundFuncで説明されている使用法

これがJSフィドルです

そしてコード：

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
    };
}