google maps api複数のマーカーと情報ウィンドウ

Question

ちょうど私の歯がGoogleマップAPIに沈んでいます。

マップ上に2つのマーカーをプロットしようとしています。完了しました。私は、しかし、各マーカーの変数/オブジェクトをリサイクルしています。

私は最初にオプション付きのマーカーを作成し、マップに追加してから、同じマーカー変数を使用して再利用し、再度マップに追加します。これは、個々のタイトルタグを持つ2つのユニークなマーカーを生成します。

各マーカーの情報ウィンドウを表示したいが、それを行う最良の方法は何か疑問がある。私は同じマーカーを追加するために同じ変数を使用しているので、クリックイベントを各マーカーに割り当てることでトラブルフラグがポップアップすることがわかります。クリックイベントをユニークなマーカーに追加する方法がわかりません（名前によってそれは任意のIDを受信したことがないよう、どちらも同じ？）

var marker_obj = new google.maps.Marker({ 
    position: myLatlng, 
    title:"This is Marker 1", 
}); 

marker_obj.setMap(map); 

marker_obj = new google.maps.Marker({ 
    position: myLatlng, 
    title:"This is Marker 2", 
}); 

marker_obj.setMap(map); 

情報ウィンドウを作成するために、私はで情報ウィンドウを維持するために一つの変数/オブジェクトを使用して考え、その後、各マーカーに新しいテキストでそれを再利用しますクリックイベント。私が持っている

質問は以下のとおりです。

1：、どのように私はそのクリックイベントを識別しない場合、私は、各マーカー（？オーバーヘッド）のために別々のユニークな変数/オブジェクトを使用する必要があります。

2：情報ウィンドウオブジェクトをポップする前に新しいテキストで再利用（再割り当て）してもよいですか、マーカーごとに固有の情報ウィンドウを作成する必要がありますか？

私はJavaのn00bのビットですので、どんな助けも大歓迎です。

Answer 1

あなたは正しい行です。 1つのマーカーオブジェクトを持っているのと同じように、1つのインフォボックスオブジェクトを持っています。次に、クリックするマーカーに応じて情報ウィンドウの内容が変わります。注意しなければならないことは、ループ内でマーカーを作成している場合にも起こります。これは、すべての情報ウィンドウが最後のコンテンツの内容になるということです。それで、コンテンツを更新する新しい関数を作成しましょう。

また、マーカーオブジェクトでsetMap（）関数を呼び出す必要はありません。マーカーを作成するときに渡すオプションにマップ属性を指定するだけで済みます。

var infowindow = new google.maps.InfoWindow({ 
    content: '' 
}); 

var marker_obj = new google.maps.Marker({ 
    position: myLatlng, 
    title:"This is Marker 1", 
    map: map 
}); 

bindInfoWindow(marker_obj, map, infowindow, 'Marker 1'); 

marker_obj = new google.maps.Marker({ 
    position: myLatlng, 
    title:"This is Marker 2", 
    map: map 
}); 

bindInfoWindow(marker_obj, map, infowindow, 'Marker 2'); 

次に、新しい機能：

function bindInfoWindow(marker, map, infowindow, html) { 
    marker.addListener('click', function() { 
     infowindow.setContent(html); 
     infowindow.open(map, this); 
    }); 
} 

Answer 2

は、グローバル情報ウィンドウオブジェクトを作成します。 var infowindow = new google.maps.InfoWindow();

グローバルマーカーのリスナーを追加します。

google.maps.event.addListener(marker, "click", function (e) { 
      infowindow.setContent("set marker specific content here"); 
      infowindow .open(map, this); 
     });