0

ドラッグ可能な多数の長方形オブジェクトでドラッグアンドドロップを実行しようとしています。

オブジェクトをドロップするためのコンテナーとして機能する長方形オブジェクトの別のセットがあります。それらをグループに追加しました。

  1. グループ/またはボックスオブジェクト(配列に格納されている)とドラッグ可能な要素とのの衝突を検出するにはどうすればよいですか?

すべてが単一のレイヤーにあります。

  1. また、ドラッグ可能な要素がグループボックスの上に配置されている場合、マウスオーバーイベント(割り当てられている)をリッスンしません-別の要素が発生したときにイベント(mouseover、mouseout)を低レベルオブジェクトに委任する方法はありますかその上をドラッグします。

    box.on("mouseover", function(e) { console.log("mouseover");});

ありがとう。

4

1 に答える 1

0
  1. KineticJS は独自の衝突検出をサポートしていないため、独自の関数を作成する必要があると思います。これらの 2 つの SO の質問は、良い出発点です。

    衝突のドラッグ

    HTML5 / kineticJS getIntersection 関数の実装

  2. この質問への回答を参照:ドラッグ中にマウスオーバー イベントを開始する方法

    KineticJS でも同様に行うことができ、ソリューションは独自の衝突検出関数の作成と密接に関連していることがわかります。ここでの唯一の違いは、div のヒット検出の座標を計算する代わりに、各形状 (この場合は長方形) の 4 つのコーナー ポイントの座標を計算できることです。また、独自のドラッグ関数を記述する代わりに、getMousePos() とイベント (dragstart、dragond、および mousemove) を使用して、フィドルの例からコードを書き直し、キネティック レクタングルに対応することができます。

于 2013-06-27T15:03:51.613 に答える