FabricJS - 変換でDeltaを取得するにはどうすればいいですか？

Question

ネイティブ関数または属性を使用してFabricJSの最後の移動からデルタ/距離を取得する方法はありますか？ 現在の座標が100x100であるとします。 要素を移動すると、新しい座標は90x120になります。 デルタは-10x20で、これはFabricJS関数またはネイティブjsコードを使用して取得する必要があります。

アイデア？ TNXオブジェクトにダウンマウスとマウスアップに

Answer 1

var canvas = new fabric.Canvas('c'); 
 
var rect = new fabric.Rect({ 
 
    left: 50, 
 
    top: 60, 
 
    fill: 'blue', 
 
    width: 150, 
 
    height: 150, 
 
}); 
 
canvas.add(rect); 
 
rect.on('mousedown', rectMouseDown); 
 
rect.on('mouseup', rectMouseUp); 
 

 
function rectMouseDown(){ 
 
this.origPos = this.getCenterPoint(); 
 
} 
 

 
function rectMouseUp(){ 
 
delta = this.getCenterPoint().subtract(this.origPos); 
 
console.log(delta.x,delta.y) 
 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.7.19/fabric.min.js"></script> 
 
<canvas id="c" width="400" height="400"></canvas>

は、中心点はgetCenterPoint()を用いて座標取り、デルタ使用subtractを取得します。