2011-11-20 28 views
22
var image = 'bullets/_st_zzzzzzl SSS.gif'; 

var bar1 = new google.maps.Marker({ 
    position: myLatLng, 
    map: map, 
    icon: image, 
    title: "bar number 1"  
}); 

    google.maps.event.addListener(bar1, 'mouseover', function() { 
     infowindow.open(map,bar1); 
    }); 

    google.maps.event.addListener(bar1, 'mouseout', function() { 
     infowindow.close(map,bar1); 
    }); 

Ahora cuando estoy mouseover quiero que el icono cambie a otra imagen que tengo. intenté algunos consejos y algunos códigos, pero nada funciona ... Apreciar tu ayudaicono de marcador de cambio en mouseover (google maps V3)

Respuesta

53

Usar marker.setIcon() function. El resto es casi el mismo que el de apertura/cierre de ventana de información en el código:

var icon1 = "imageA.png"; 
var icon2 = "imageB.png"; 

var marker = new google.maps.Marker({ 
    position: myLatLng, 
    map: map, 
    icon: icon1, 
    title: "some marker" 
}); 

google.maps.event.addListener(marker, 'mouseover', function() { 
    marker.setIcon(icon2); 
}); 
google.maps.event.addListener(marker, 'mouseout', function() { 
    marker.setIcon(icon1); 
}); 

Tenga en cuenta que, además de utilizar las rutas de imágenes en setIcon() función, también se puede utilizar google.maps.MarkerImage objetos, que son muy útiles, especialmente si desea utilizar imagen sprites.

+0

esto funcionó muy bien para mí! – Avishai

+0

¿Podría proporcionar una solución para Sprite. Intento usar 'setIcon()' para cambiar el origen del icono al pasar el mouse y esto no funciona – sgromskiy

-1
google.maps.event.addListener(marker, 'mouseover', function() { 
    infowindow.open(map, this); 
}); 

// assuming you also want to hide the infowindow when user mouses-out 
google.maps.event.addListener(marker, 'mouseout', function() { 
    infowindow.close(); 
}); 
Cuestiones relacionadas