fabric.js - Parent w/oを基にした "Child"オブジェクトの回転グループ化

Question

fabric.js（1.7.11）を使用して、1つのオブジェクトをグループ化せずに別のオブジェクトの回転に追従させようとしています。子オブジェクトの親への位置。だから私は、（1） "子"オブジェクトの回転中心を "親"の回転中心に設定し、次に（2）親オブジェクトが回転しているので、その回転デルタを子に適用します回転した状態で）。ここで

は擬似コード

canvas.on('object:rotating', canvasEvent_ObjectRotating); 

function canvasEvent_ObjectRotating(e) 
{ 
    // set r2'2 center of rotation = r1's center of rotation 

    // r2.angle += (delta of rotation of r1 angle) 

} 

で最終的な結果は、子が親に「スタック」と表示されていることなどである（ゲームボード上のスティッキーノートのように、そしてあなたは、ゲームボードを回転させます）ここで

フィドルです：

https://jsfiddle.net/emaybert/bkb5awj6/

1または2で任意の助けいただければ幸いです。オブジェクトの角度デルタの取得方法：コールバックの回転、および/またはオブジェクトを任意の点でピボットする方法。私はfabric.util.rotatePointへの参照とそれを使って行を回転させる方法の例を見ましたが、オブジェクトではなく、その精神変換を行うことができませんでした。

Answer 1

これはあなたがやろうとしていることですか？ https://jsfiddle.net/logie17/ofr8e6qd/1/

function canvasEvent_ObjectRotating(e) 
{ 
    origX = r2.getCenterPoint().x; 
    origY = r2.getCenterPoint().y; 
    let topLeftPoint = new fabric.Point(origX, origY); 

    if (!previousAngle) { 
    previousAngle = r1.getAngle(); 
    } 
    let angle = fabric.util.degreesToRadians(r1.getAngle() - previousAngle); 
    previousAngle = r1.getAngle(); 
    let center = r1.getCenterPoint(); 
    let origin = new fabric.Point(r1.left, r1.top); 
    let newCoords = fabric.util.rotatePoint(topLeftPoint,origin,angle); 

    r2.set({ left: newCoords.x, top: newCoords.y }).setCoords(); 
}