2016-07-25 25 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被禁用的更新點的代碼。 但是,如果我使用旋轉選項被啓用和旋轉後的對象下面的代碼得到更新點,我得到錯誤的一組點,所以現在我已禁用旋轉選項。如果任何人可以說如何修改下面的代碼以啓用旋轉選項並獲得正確的點集,將會非常有幫助。

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