0

取得方法 キャンバス オブジェクト/長方形の中心点。私は小さなプロジェクトに Konvajs ライブラリを使用しています。konvaのドキュメントでは、適切な回転を得るにはポイントを中央に配置する必要があると述べています。 http://konvajs.github.io/docs/animations/Rotation.html

元

 var yellowRect = new Konva.Rect({
    x: 220,
    y: 75,
    width: 100,
    height: 50,
    fill: 'yellow',
    stroke: 'black',
    strokeWidth: 4,
    offset: {
        x: 50 // how to solve this using formula so it will dynamic,
        y: 25 // how to solve this using formula so it will dynamic
    }
});
4

1 に答える 1

2

中心を中心に長方形のオブジェクトを回転させる

デフォルトでは、KonvaJS は長方形の回転ポイントを左上隅に設定します。したがって、長方形の中心から回転するには、回転ポイントを長方形の中心にプッシュする必要があります。

offsetX=rectangleWidth/2とを設定することでこれを行うことができますoffsetY=rectangleHeight/2

var yellowRectWidth=100;
var yellowRectHeight=50;
var yellowRect = new Konva.Rect({
    x: 220,
    y: 75,
    width: yellowRectWidth,
    height: yellowRectHeight,
    fill: 'yellow',
    stroke: 'black',
    strokeWidth: 4,
    offset: {
        x: yellowRectWidth/2,
        y: yellowRectHeight/2
    }
});

中心を中心に円形オブジェクトを回転させる

デフォルトでは、KonvaJS は円形状の回転ポイントをその中心点に設定します。したがって、円形の中心から回転するために、オフセットを設定する必要はありません。

于 2016-01-19T07:42:17.613 に答える