Google maps 将鼠标悬停在多边形上（显示文本）

我在谷歌地图上画了几个多边形。现在我想在多边形上添加鼠标悬停（mouseover）和鼠标悬停（mouseout），这样当您将鼠标悬停在多边形上时，您可以看到该区域的名称。当你将鼠标移出时，名字就会消失（就像你将鼠标悬停在浏览器的按钮上）

这就是我认为它的样子，但我不知道它是如何工作的。

下面是一个例子：

与浏览器工具提示不完全相同，但可以设置文本样式。我用的是MarkerWithLabel。每个标记都用于其多边形的名称。要切换多行框，请更改CSS中的

空白：nowrap

。也有InfoBox作为一个工作选项，但我发现它比MarkerWithLabel更复杂

事件侦听器根据鼠标位置移动MarkerWithLabel：

  google.maps.event.addListener(poly, "mousemove", function(event) {
    marker.setPosition(event.latLng);
    marker.setVisible(true);
  });
  google.maps.event.addListener(poly, "mouseout", function(event) {
    marker.setVisible(false);
  });

---

我没有在各种浏览器中测试过这一点，但在Chrome中，它为我提供了一个窍门：将包含地图的div称为“map\u canvas”。此外，为了使每个多边形都有自己的标题，请将属性“sourceName”设置为多边形的标题

permiture.addListener（'mouseover'，function（）{
var map_canvas=document.getElementById（“map_canvas”）；
map_canvas.title=this.sourceName；
});
addListener（'mouseout'，function（）{
var map_canvas=document.getElementById（“map_canvas”）；
map_canvas.removeAttribute（“标题”）；
});  google.maps.event.addListener(poly, "mousemove", function(event) {
    marker.setPosition(event.latLng);
    marker.setVisible(true);
  });
  google.maps.event.addListener(poly, "mouseout", function(event) {
    marker.setVisible(false);
  });