2016-07-25 59 views
1

オブジェクトの変更後に新しいポイント座標を取得したいのですが、変更後のポイント座標を取得するときに、それらがポリゴンを描画したポイント座標と同じです。 誰でも私にそれを教えてもらえますか?以下は私のコード、下記のオブジェクトを修正した後にポイント座標を取得するにはどうすればよいですか?

<!--fabricjs --> 
canvas.on('object:modified', function(e){ 

var obj=e.target; 
console.log("new point coordinates "+obj.points); 
}); 
+0

ソリューションを見つけましたか?私は同じ問題を抱えています。 – Fidel90

+1

@ Fidel90はい私はそれを持っていますが、ROTATEオプションを無効にしています。 pathOffsetで各点を減算し、各点にTranform行列を乗算します。これは回転なしで動作します。 –

答えて

2

は、私はROTATEが無効になっているとの更新ポイントを取得するために使用されるコードです。 しかし、以下のコードを使用して回転オプションを有効にして、オブジェクトを回転させた後に更新点を取得した場合、間違った点集合が得られるので、現在はrotateオプションを無効にしています。どのようにすれば、以下のコードを変更してrotateオプションを有効にし、正しいポイントセットを得ることができれば、大きな助けになるでしょう。

<!-- fabric js --> 
     canvas.on('object:modified', function(e) { 
       var newCoordinates = ""; 
       var matrix = []; 
       var polygon = canvas.getItemById(e.target.id); 
       matrix = polygon.calcTransformMatrix(); 
       var translatedPoints = polygon.get('points').map(function(p) { 
        return { 
         x: p.x - polygon.pathOffset.x, 
         y: p.y - polygon.pathOffset.y 
        }; 
       }); 
       for (var i = 0; i < translatedPoints.length; i++) { 
        translatedPoints[i].x = matrix[0] * translatedPoints[i].x + matrix[2] * translatedPoints[i].y + matrix[4]; 
        translatedPoints[i].y = matrix[1] * translatedPoints[i].x + matrix[3] * translatedPoints[i].y + matrix[5]; 
       } 
       var newUpdatedPoints = JSON.stringify(translatedPoints); 
      }); 
関連する問題