2

Web（実際にはモバイル開発のWebビュー）では、バスケットボールコートのイメージがあります。コート画像上の領域のクリック（タッチ）が3ポイントの線の内側にあるか外側にあるかを検出する必要があります。これを達成する最も簡単な方法は何ですか？古い学校の画像マップ？SVG？キャンバスタグ？

4

3 に答える 3

1

イメージマップは、おそらく最も複雑でない実装です。それ以外の場合は、コートの任意の場所でクリックをサブスクライブしてから、画像に対するマウスの座標を調べます。

私があなたなら、クライアント側のコードを書く手間を省き、画像マップを使用するだけです。彼らはこのようなことのためにうまく機能します。

http://www.w3schools.com/tags/tag_map.asp

于 2012-05-08T02:40:24.250 に答える
1

これは、KineticやFabric<canvas>などのよく知られたフレームワークを使用して要素に対して行うのが最も簡単です。

最下層に画像をロードしてから、画像全体に3ポイントの層を適用します。3ptレイヤーの上には、円弧の形をした2ptレイヤーがあります。上から下へのレイヤリングは次のようになります。

- 2pt "arc" layer on either side  |
- 3pt "full court" layer          |  Click propagation
- court image                     V

したがって、プレーヤーが2ptアークレイヤーの内側に触れると、2ptであることがわかります。プレイヤーが弧の外側に触れると、タッチをキャッチするのは3ptレイヤーです。さらに、フレームワークにより、基盤となるレイヤーへの伝播が可能になる場合があります。あなたはそれを防ぐ必要があります。

于 2012-05-08T05:35:20.123 に答える
0

キャンバスを使用しない場合は、おそらくこのソリューションを使用できます。画像をクリックして、Javascript（2006）で座標を取得します。

キャンバスの場合も解決策があります。

  1. キャンバス要素でのマウスクリックの座標を取得するにはどうすればよいですか？
  2. キャンバスでのマウスの位置の取得

最も簡単な解決策は、ライブラリを取得してその関数を使用することです...

于 2012-05-08T05:54:22.443 に答える