グーグルマップ：ポリゴンをクリックしてインフォウィンドウを開く方法は？

StackOverflow https://stackoverflow.com/questions/2846041

質問

簡単な質問がありますが、Google MapsAPIのドキュメントで答えが見つかりません...

APIによって描画された13個のポリゴンを含むマップがあります。これらのポリゴンの1つの例を次に示します： ジェネラコディセタグプレ

次に： ジェネラコディセタグプレ

ポリゴンがマップに表示されます。問題ありません。 しかし、私が今しなければならないことは、各ポリゴンをクリックして「InfoWindow」を開くことです（ポリゴンごとに異なるコンテンツを使用）。

誰かがアイデアや例を持っていましたか？

ご協力いただきありがとうございます！

役に立ちましたか？

解決

しばらくAPIを使用しておらず、大量のコードをアップロードするのに苦労しているため、ソリューションについて説明します。ここでは、コード編集機能には使用していません。詳細については、APIリファレンスを参照してください。

では、始めましょう：

  1. map.AddOverlay（）を使用してポリゴンを追加すると、マップにポリゴンが保存されます。
  2. マップへのクリックをキャッチするイベントハンドラーを宣言します。そのイベントハンドラーには、クリックされた場所のGLatLngと、クリックされたオーバーレイ（この場合はポリゴン）が渡されます。簡単なタイプテストを実行して、オーバーレイがポリゴンであるかどうかを判断できます。
  3. イベントハンドラーでmap.openInfoWindowHtml（）を使用し、場所として指定されたGLatLngと、表示するHTMLコンテンツを渡します。

    それはとても簡単です！私は頭のてっぺんから詳細を覚えていないので、イベントハンドラーをどのようにアタッチするかを調べる必要があります。したがって、APIで検索する必要があるのは次のとおりです。

他のヒント

個別の情報ウィンドウを持つ複数のポリゴンを持つための非常に優れたソリューションを見つけました。

これが私のコードです： ジェネラコディセタグプレ

同じポリゴンをもう一度クリックしてInfowindowsを閉じる機能も提供します。

こんにちは、filip-fkuに感謝します！

あなたのコメントに感謝します、私はついにこれを行う方法を見つけます！:-) したがって、誰かが「これを行う方法」を検索した場合、ここにコードスニペットがあります： ジェネラコディセタグプレ

これがお役に立てば幸いです！

フィリップにもう一度感謝します！:)

グローバル情報ウィンドウは必要ありません。イベントハンドラが機能する側で情報ウィンドウを初期化します。 このプロトタイプを使用して、ポイントがポリゴンの配列内のポリゴンのインスタンスに含まれているかどうかを確認します。

http://hammerspace.co.uk/projects/maps/ >

http://www.ikeepuposted.com/area_served.aspx

V3でも、インフォウィンドウを使用しますが、構文は異なります： ジェネラコディセタグプレ

テキストを変更して情報ウィンドウを表示したい場所： ジェネラコディセタグプレ

iはポリゴンとeventlistenerのグローバル変数を（変数宣言の「var」を抑制して）作成したので、他の関数でそれらを変更できます。これは、infowindowの動作には注意が必要です。一部の人々はinfowindowのインスタンスを好みます、私はむしろ1つのグローバルインスタンスを持ち、その場でそのコンテンツを変更したいと思います。変数宣言の影響に注意してください！

ポリゴン用の他のaddListenerは非常にバグが多く、公開する前にすべての主要なブラウザ、特にDRAGGINGとMOUSEOVERのバリエーションでテストする必要があります。

これにはいくつかの参照があります： http://code.google.com/apis/maps/documentation/javascript/overlays.html

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top