1

これを解決する方法を理解するのに苦労しています。

内部にポリゴンを保持する KineticGroup があります。また、ポリゴンの右上隅にボタン (KineticCircle) があり、ユーザーがドラッグしてポリゴンを傾斜させることができます。

これはすべて機能しています。私の問題は次のとおりです。

ボタンはポリゴンで歪んでいます! スキューは画像の上部をボタンに移動するため、ポリゴンをたどる必要がありますが、元の形を維持する必要があります。

ボタンをメイングループ内の別のグループに移動して削除/追加しようとしましたが、それでも歪んでいます。

また、ポリゴン グループとボタン グループを保持する親グループを作成しようとしましたが、ボタン グループが静止したままになり、これは私にとっては悪いことでした。

これを解決する方法はありますか？子グループを親グループの変換の影響を受けないようにする方法はありますか?

前もって感謝します

4

1 に答える 1

1

プロパティ var によってスキューが制御される長方形であるカスタムの KineticJS シェイプを作成するのはどうでしょうか。

次に、レイヤーを傾斜させる必要はありません。

// skewRect properties to manipulate skew, etc.
var skewY=0;
var skewX=0;
var width=50;
var height=25;

var skewRect = new Kinetic.Shape({
  drawFunc: function(canvas) {
    var context = canvas.getContext();
    context.save();
    context.beginPath();
    context.transform(1, skewX, skewY, 1, 0, 0);
    context.fillRect(-width/2, -height/2, width, height);
    context.closePath();
    canvas.fillStroke(this);
    context.restore();
  },
  fill: 'red',
  stroke: 'black',
  strokeWidth: 4
});
于 2013-04-27T16:54:06.800 に答える