オンホバーマーカーアイコンがGoogleマップ

Question

に変更を取得し、私はすでに、私は今、私は地図上の複数のマーカーを示してきた、もう一つの新しい問題が提起されたものの答えに応じて

を尋ねた質問のいくつかのようなタイプが自分のしている見てきました私は特定のマーカーに、その後のアイコンが変更を取得置いて、私はマーカーから私のカーソルを削除すると、以前のアイコンを設定した場合に必要な、以下のコードの上

for (i = 0; i < Object.size(locations); i++) { 
     marker = new google.maps.Marker({ 
     position : new google.maps.LatLng(locations[i][1], locations[i][2]), 
     icon  : site_url+'/assets/front/images/'+locations[i][4], 
     map  : map, 
     url  : site_url+'/detail/'+locations[i][3], 
     draggable: false, 
     hovericon: site_url+'/assets/front/images/'+hovericon, 
     }); 
     google.maps.event.addListener(marker, 'click', function() { 
      window.location.href = this.url; 
     }); 
     google.maps.event.addListener(marker, "mouseover", function() { 
      marker.setIcon(this.hovericon); 
     }); 
     google.maps.event.addListener(marker, "mouseout", function() { 
     marker.setIcon(this.icon); 
     }); 
     markers.push(marker); 

    function AutoCenter() { 
     var bounds = new google.maps.LatLngBounds(); 
     $.each(markers, function (index, marker) { 
     bounds.extend(marker.position); 
     }); 
     map.fitBounds(bounds); 
    } 
    AutoCenter(); 
    } 

が良好であることを複数のマーカーを示している私のコードですが、私はに置くと、それは常に最後のマーカーアイコンを変更しますが、私はそのアイコンを変更する必要があります、私は最後のものではなく、ホバリングします。私は任意のマーカーに合わせると

は常に最後のアイコンは、私は最初、最後から二番目のアイコンが変化しているために置くと添付画像に表示変更されます。

私は間違って何をしていますか？

Answer 1

これは、forが終了するときにリスナーに接続する最後のマーカーがあるために起こります。

addListeners内のこのマーカーの詰め込みを使用して、目的のマーカーを取得できます。

for (i = 0; i < Object.size(locations); i++) { 
     marker = new google.maps.Marker({ 
     position : new google.maps.LatLng(locations[i][1], locations[i][2]), 
     icon  : site_url+'/assets/front/images/'+locations[i][4], 
     map  : map, 
     url  : site_url+'/detail/'+locations[i][3], 
     draggable: false, 
     originalicon: site_url+'/assets/front/images/'+locations[i][4], 
     hovericon: site_url+'/assets/front/images/'+hovericon 
     }); 
     google.maps.event.addListener(marker, 'click', function() { 
      window.location.href = this.url; 
     }); 
     google.maps.event.addListener(marker, "mouseover", function() { 
      this.setIcon(this.hovericon); 
     }); 
     google.maps.event.addListener(marker, "mouseout", function() { 
      //you have to retreive the original icon cause with the mouse hover you change the marker icon attribute 
      this.setIcon(this.originalicon); 
     }); 
     markers.push(marker); 

    function AutoCenter() { 
     var bounds = new google.maps.LatLngBounds(); 
     $.each(markers, function (index, marker) { 
     bounds.extend(marker.position); 
     }); 
     map.fitBounds(bounds); 
    } 
    AutoCenter(); 
    } 

このようにして、対話している要素（mouseoverとmouseout）を参照し、forループの最後の要素は参照しません。

私はコードをテストしていないので、わかりません。

ワーキングサンプルのためthisフィドル見

希望これは