Google Maps API v3, cómo cambiar el icono de marcador al hacer clic

Question

¿Cómo puedo cambiar un icono de marcador cuando se hace clic en un marcador (en un evento de clic) y devolverlo a un icono normal cuando se hace clic en otro marcador?

Answer 1

No he probado este código, por lo que puede haber errores tipográficos o errores, pero debería darle la idea.

En primer lugar, definir una devolución de llamada para establecer todos los marcadores al icono normal (para restablecer cualquier previamente ha hecho clic marcadores) y el icono de la corriente del marcador se ha hecho clic en el icono seleccionado:

var markerCallback = function() { 
    for (var i=0; i<arrayOfMarkers.length; i++) { 
     arrayOfMarkers[i].setIcon(normalIcon); 
    } 
    this.setIcon(selectedIcon); 
} 

A continuación, asignar la devolución de llamada el evento de clic en cada marcador así:

google.maps.event.addListener(marker, 'click', markerCallback); 

Sin duda, hay algunas mejoras de código que se podrían realizar. Por ejemplo, es posible que no desee que normalIcon, selectedIcon y arrayOfMarkers sean variables globales de la forma en que el código anterior supone que son. Y si tiene muchos marcadores, probablemente desee realizar un seguimiento del marcador previamente seleccionado en lugar de tener un bucle for que reinicie el icono en cada uno de ellos.

Pero como dije, esto debería darle la idea.

Answer 2

Sólo en cualquier caso alguien quiere ver un ejemplo de hacer el seguimiento del marcador anterior en una variable global como Kasper ha mencionado, esto es lo que hice:

google.maps.event.addListener(marker,'click',function() { 

     if (selectedMarker) { 
      selectedMarker.setIcon(normalIcon); 
     } 
     marker.setIcon(selectedIcon); 
     selectedMarker = marker; 
    }); 

(después de ajustar selectedMarker como una variable global)