1

Kinetic JS を使用して、ステージ全体がドラッグ可能である場合、ステージの現在の中心にズームインするにはどうすればよいですか?

以前の質問の回答の助けを借りて、中心からズームすることができました。ただし、これの問題は、ステージが他の場所にドラッグされた場合でも、常に元の中心点からスケーリングされることです。元の中心点は現在の中心点ではないため、ズームインするとステージが別の場所に移動し始めます。

このJSFiddleを作成したことを示すために:http://jsfiddle.net/uJeyC/2/

var group = new Kinetic.Group({
    x: width / 2,
    y: height / 2,
    width: width,
    height: height
});

group.setOffset(width / 2, height / 2);

問題を示す画像を次に示します。

ここに画像の説明を入力

現在の中心点を計算し、ズーム倍率でグループを乗算してから、新しい中心点を計算するなど、いくつかのことを試しました。それとの差を利用してグループをオフセットしましたが、オフセットが大きすぎたためうまくいきませんでした。

これに似た質問は次のとおりです: Kinetic JS でドラッグされた Kinetic.Path 要素のオフセットを調整して、オフセットの中心を常に Stage に保ちます。しかし、与えられた答えは満足のいくものではありません。なぜなら、左上からズームし、KinectJS の古いバージョンでのみ機能するライブラリを示唆しているからです。

4

0 に答える 0