web-dev-qa-db-ja.com

Google Map API V3：マーカーにカスタムデータを追加する方法

後で使用するためにカスタム情報をマーカーに追加する方法はありますか。情報ウィンドウとタイトルを設定する方法はありますが、マーカーを他の情報に関連付けたい場合はどうでしょうか。

私はマーカーに依存するページに表示される他のものを持っているので、マーカーがクリックされると、クリックされたマーカーに応じてページのコンテンツを変更する必要があります。クリックなど.

ありがとう

google-mapsgoogle-maps-api-3google-maps-markers
107
Abid

GoogleマーカーはJavaScriptオブジェクトなので、key: valueという形式でカスタム情報を追加できます。ここで、キーは有効な文字列です。これらはオブジェクトプロパティと呼ばれ、さまざまな方法でアプローチできます。値は、数値や文字列などの単純な正当なものであれば何でもかまいません。また、関数やその他のオブジェクトでもかまいません。 3つの簡単な方法：宣言、ドット表記、角括弧

var markerA = new google.maps.Marker({
    map: map,
    position: new google.maps.LatLng(0, 0),
    customInfo: "Marker A"
});

var markerB = new google.maps.Marker({
    map: map,
    position: new google.maps.LatLng(-10, 0)
});
markerB.customInfo = "Marker B";

var markerC = new google.maps.Marker({
    map: map,
    position: new google.maps.LatLng(-20, 0)
});
markerC['customInfo'] = "Marker C";

次に、同様の方法で取得します。

google.maps.event.addListener(markerA, 'click', function() {
    alert(this.customInfo);
});
197
Tina CG Hoehr

独自のカスタムプロパティをマーカーに追加できます（APIのプロパティと競合しないように注意してください）。

14
geocodezip