我创建的地图有多个用多边形勾勒出来的区域。当用户将鼠标悬停在某个部分上时,会弹出一个自定义标记,并在鼠标移出时标记消失。我已经完成了所有工作,但无法弄清楚如何让标记在mouseout上消失。下面的代码不是每个部分,但我希望只显示一个部分如何工作将提供足够的信息。我对Maps API和javascript有点新,所以我希望我把第一部分设置正确,但我会喜欢任何建议。我想我需要以某种方式访问noMarker函数中的标记......
//Sets up the polygon
var mapWC = new google.maps.Polygon({
paths: coordsWC,
strokeColor: "#14b400",
strokeOpacity: 0.5,
strokeWeight: 3,
fillColor: "#14b400",
sectionName: "West Cambridge",
markerImage: 'images/hood-marker.png',
markerLL: new google.maps.LatLng(42.3751819960975,-71.15445431301595),
fillOpacity: 0.33
});
mapWC.setMap(map);
//Mouse in and out
google.maps.event.addListener(mapWC, 'mouseover', showMarker);
google.maps.event.addListener(mapWC, 'mouseout', noMarker);
//functions
function showMarker(){
//var secName = this.sectionName;
//console.log(secName);
var image = this.markerImage;
var myLatLng = this.markerLL;
var themarker = new google.maps.Marker({
position: myLatLng,
map: map,
icon: image
});
} // End showMarker
function noMarker(){
//console.log("Moused Out");
}
答案 0 :(得分:1)
保持对javascript顶部声明的标记的变量引用,例如var marker;
查看我的JS fiddle: Showing and hiding marker on mouse over and out
编辑:我注意到我使用法线贴图而不是多边形展示了这一点 - 但是相同的代码应该可以工作,因为多边形似乎支持相同的事件,请参见此处的列表:google maps api polygon events
嗯,这是使用polygon的例子: JS fiddle polygon ,技巧是将标记存储到实际的多边形对象,因此很容易访问,至少我认为是这样: ) - 如果你想添加几个多边形,尝试将它们全部存储在数组内而不是一些全局多边形变量;)干杯!