2011-11-20 202 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); 
    }); 

現在,當我在鼠標懸停我想圖標更改爲另一個圖像我得到。 我試了一些提示和一些代碼,但沒有什麼作品... 欣賞你的幫助鼠標懸停更改標記圖標(谷歌地圖V3)

回答

53

使用marker.setIcon()函數。剩下的幾乎是一樣的開/在你的代碼關閉信息窗口:

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); 
}); 

注意的是,除了在setIcon()功能利用圖像路徑,您也可以使用google.maps.MarkerImage對象,這是非常有用的,特別是如果你想使用圖像精靈。

+0

這對我很好! – Avishai

+0

您能否爲精靈提供解決方案?我嘗試使用'setIcon()'來更改mouseover上的圖標原點,這不起作用 – 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(); 
});