Javascript 谷歌地图多边形在鼠标上消失
我正在使用API v3在谷歌地图上绘制多边形，并将Javascript 谷歌地图多边形在鼠标上消失,javascript,google-maps,google-maps-api-3,polygon,Javascript,Google Maps,Google Maps Api 3,Polygon,我正在使用API v3在谷歌地图上绘制多边形，并将mouseover和mouseout事件附加到这些多边形上。基本上，它是一张45个区域的地图，在一个区域上有多边形 我在地图上画了两个多边形，但在第一个多边形的mouseout上，它消失了。第二个多边形很好。这可能会把第二个搞砸。下面是我完整的源代码 <html> <head> <title>GMap</title> </head> <body> <di
mouseovermouseoutmouseout<html>
<head>
<title>GMap</title>
</head>
<body>
<div id="gmap" style="width:1000px;height:400px"></div>
</body>
</html>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script type="text/javascript">
var mapOptions = {
zoom: 13,
center: new google.maps.LatLng(16.798296, 96.173716)
}
var polyOptions = {
strokeColor: "#FF0000",
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: "#0000FF",
fillOpacity: 0.6
}
var polyOptionsHover = {
strokeColor: "#FF0000",
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: "#00FF00",
fillOpacity: 0.6
}
var map = new google.maps.Map(document.getElementById('gmap'), mapOptions);
// First Polygon
var $path = [
["16.786217","96.134233"],
["16.782273","96.136894"],
["16.777014","96.136465"],
["16.773809","96.135092"],
["16.774631","96.128397"],
["16.779972","96.121359"],
["16.785806","96.119299"],
["16.791148","96.119299"],
["16.794845","96.119900"],
["16.797639","96.120329"],
["16.798132","96.124277"],
["16.798214","96.127796"],
["16.794024","96.133547"]
];
var myCoordinates = [];
for(i=0; i<$path.length; i++){
myCoordinates.push(new google.maps.LatLng($path[i][0], $path[i][1]));
}
var pOptions = polyOptions;
pOptions.path = myCoordinates;
var polygon = new google.maps.Polygon(pOptions);
polygon.setMap(map);
google.maps.event.addListener(polygon, "mouseover", function(){
this.setOptions(polyOptionsHover);
});
google.maps.event.addListener(polygon, "mouseout", function(){
this.setOptions(polyOptions);
});
// Second Polygon
var $path = [
["16.782437","96.137066"],
["16.777014","96.136723"],
["16.774795","96.139040"],
["16.772247","96.147623"],
["16.781040","96.147795"],
["16.784656","96.142902"],
["16.785889","96.134834"]
];
var myCoordinates = [];
for(i=0; i<$path.length; i++){
myCoordinates.push(new google.maps.LatLng($path[i][0], $path[i][1]));
}
var pOptions = polyOptions;
pOptions.path = myCoordinates;
var polygon = new google.maps.Polygon(pOptions);
polygon.setMap(map);
google.maps.event.addListener(polygon, "mouseover", function(){
this.setOptions(polyOptionsHover);
});
google.maps.event.addListener(polygon, "mouseout", function(){
this.setOptions(polyOptions);
});
</script>
GMap
变量映射选项={
缩放：13，
中心：新google.maps.LatLng（16.79829696.173716）
}
var多选项={
strokeColor:#FF0000“，
笔划不透明度：0.8，
冲程重量：2，
fillColor:#0000FF“，
填充不透明度：0.6
}
变量polyOptionsHover={
strokeColor:#FF0000“，
笔划不透明度：0.8，
冲程重量：2，
fillColor:#00FF00“，
填充不透明度：0.6
}
var map=new google.maps.map（document.getElementById（'gmap'），mapOptions）；
//第一多边形
var$path=[
["16.786217","96.134233"],
["16.782273","96.136894"],
["16.777014","96.136465"],
["16.773809","96.135092"],
["16.774631","96.128397"],
["16.779972","96.121359"],
["16.785806","96.119299"],
["16.791148","96.119299"],
["16.794845","96.119900"],
["16.797639","96.120329"],
["16.798132","96.124277"],
["16.798214","96.127796"],
["16.794024","96.133547"]
];
var坐标=[]；
对于（i=0；i您正在将路径存储在pOptions/polyOptions对象中。请将其分开。而不是：
var pOptions = polyOptions;
pOptions.path = myCoordinates;
var polygon = new google.maps.Polygon(pOptions);
polygon.setMap(map);
做：
我不知道函数setPath（）
请参见
var polygon = new google.maps.Polygon(pOptions);
polygon.setPath(myCoordinates);
polygon.setMap(map);