0

マップにいくつかのマーカーがあり、「クリック」したマーカーに応じて、1 つまたは別のマーカーをアニメーション化したいと考えていました。しかし、アニメーションは私が作成した最後のマーカーでのみ機能し、他のマーカーでは機能しません。マーカーを配列として作成しようとしましたが、同じ問題です。コードは次のとおりです。

<script type="text/javascript">


    var marker = null;
    var address = null;
    var altura = null;

function codeAddress() {
  altura = document.getElementById('altura').value;
  address = document.getElementById('address').value + ' ' + altura ;
  geocoder.geocode( { 'address': address}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      map.setCenter(results[0].geometry.location);
    // Marker
      marker = new google.maps.Marker({
          map: map,
          icon: document.getElementById('icono').value,
          position: results[0].geometry.location,
          animation: google.maps.Animation.DROP
      });
    // Animating Listener
      google.maps.event.addListener(marker, 'click', toggleBounce);
    } else {
      alert('Error: ' + status);
    }
  });
}

function toggleBounce() {
  if (marker.getAnimation() != null) {
    marker.setAnimation(null);
  } else {
    marker.setAnimation(google.maps.Animation.BOUNCE);
  }
}

</script>

前もって感謝します。

4

1 に答える 1

2

アニメーション化するすべてのマーカーへの参照を保持してから、アニメーションを正しいマーカーに設定する必要があります。投稿したコードにはマーカーが 1 つしかありません。

問題を解決する 1 つの方法は、関数クロージャーを使用することです。

function createMarker(latlng, address, icon){
    // Marker
      var marker = new google.maps.Marker({
          map: map,
          icon: icon,
          position: latlng,
          animation: google.maps.Animation.DROP
      });
    // Animating Listener
      google.maps.event.addListener(marker, 'click', function() {
        if (marker.getAnimation() != null) {
          marker.setAnimation(null);
        } else {
          marker.setAnimation(google.maps.Animation.BOUNCE);
        }
      });
}

実施例

于 2013-08-26T04:47:30.533 に答える