谷歌地图v3 API鼠标悬停多边形？答案

【问题标题】：google maps v3 API mouseover with polygons?谷歌地图v3 API鼠标悬停多边形？
【发布时间】：2009-11-17 20:57:16
【问题描述】：

我正在使用 google v3 api 构建地图，因为它更快。从本质上讲，它是一个区域的地图，其中包含大约 30 个城市，区域上有多边形。当用户将鼠标悬停在一个城市上时，我希望 fillColor 变亮，然后在鼠标悬停时返回正常状态。当用户点击时，它会将他们重定向到另一个页面。

点击事件工作得很好。但是，查看 v3 API 文档，似乎 Google 已经实现了 click、doubleclick、mousemove、mousedown 和 mouseup 作为事件触发器，但没有 hover、mouseover 或 mouseout。

真的吗？哎呀。我认为一遍又一遍会比向下和向上更优先。

无论如何，还有其他人遇到过这个吗？我错了吗？或者有什么解决方法？

提前感谢您的帮助，斯蒂芬妮

【问题讨论】：

标签： javascript ajax google-maps

【解决方案1】：

以下作品：

google.maps.event.addListener(polygon,"mouseover",function(){
 this.setOptions({fillColor: "#00FF00"});
}); 

google.maps.event.addListener(polygon,"mouseout",function(){
 this.setOptions({fillColor: "#FF0000"});
});

【讨论】：

我在 Google Groups 中提出了请求，管理员回复说他们对此有多个请求，然后实施了它。谢谢！

【解决方案2】：

在 Google Maps API V3 中，我使用以下代码对多边形进行了翻转。我不喜欢每次翻转都必须取消设置和重置地图，但是，此时，这就是我实现鼠标悬停的方式。

我对任何有关如何改进此代码的 cmets 感兴趣。

var polyShape     = new google.maps.Polygon({paths:polyData,strokeColor:"#aa0",strokeOpacity:0.5,strokeWeight:1,fillColor:"#cc0",fillOpacity: 0.25});
var polyShapeOver = new google.maps.Polygon({paths:polyData,strokeColor:"#cc0",strokeOpacity:0.5,strokeWeight:1,fillColor:"#ff0",fillOpacity: 0.25}); 

polyShape.setMap(map);

google.maps.event.addListener(polyShape,"mouseover",function(){
  this.setMap(null);
  polyShapeOver.setMap(map);
}); 

google.maps.event.addListener(polyShapeOver,"mouseout",function(){
  this.setMap(null);
  polyShape.setMap(map);
});

【讨论】：

【解决方案3】：

Maps API V3 events 是按对象定义的。在V3 reference page 上进行搜索表明，Marker 是唯一具有 mouseover 和 mouseout 定义的对象。所以是的，你似乎是对的。

顺便说一句，有人这样做，但看起来很复杂：

http://groups.google.com/group/Google-Maps-API/browse_thread/thread/4ddc4f5888994563

【讨论】：

【解决方案4】：

mouseover 和 mouseout 现在在 V3 Polyline 中实现。

【讨论】：