web-dev-qa-db-ja.com

オブジェクトがプログラムで移動した後のFabricjsは、新しい位置では選択できません

プログラムでオブジェクトを移動して成功を収めようとしましたが、プログラムでオブジェクトを移動した後、オブジェクトの現在の位置を選択してもオブジェクトを選択できません。それでも、オブジェクトは、試した古い位置から選択できます。 canvas.calcOffset();はまだ機能していません。

次のように、現在の位置でオブジェクトを選択可能にする方法

Javascript

 var canvas=new fabric.Canvas('canvas');
 canvas.add(new fabric.Rect({                    
                    left:100,
                    top: 100,
                    width: 75,
                    height: 50,
                    fill: 'white',
                    stroke: 'black',
                    strokeWidth: 3,
                    padding: 10,
                    selectable: true
             }));


function changePosition()
{
    canvas.item(0).set({left:300});
    canvas.renderAll();
    canvas.calcOffset();
}

[〜＃〜] html [〜＃〜]

<div>
<canvas id="canvas" width="400" height="400" style="border:1px solid red"/>
</div>
<input type="button" onclick="changePosition()" value="Change Possition"/>

Jsfiddle

エラーを再現する手順

  1. クリック Change Position ボタン
  2. 現在の位置で長方形を選択してみて、オブジェクトが以前そこにあった場所にカーソルを移動すると、オブジェクトを選択できるようになります。
javascriptfabricjs
25
Thirumalai murugan

プログラムでオブジェクトの位置を変更する場合は、setCoords（）メソッドを1回起動する必要があります。これにより、オブジェクトの座標が新しい位置に設定されます。

38
Innodel