适用于Google Maps API v3的可扩展地图标记覆盖

Question

我一直在使用Google Maps API v3很长一段时间。我想创建一个可扩展的谷歌地图标记，用于我的地图。我一直在使用类似于下图中的地图标记： -

我想要做的是当我将鼠标悬停在地图上的这个标记上时，它应该展开并显示标记描述，类似于下图 -

标记应该返回到第一张图像，即悬浮时的正常图像。这应该是相当简单的，但是，我不知道在哪里以及如何开始。任何帮助将非常感激。

Answer 1

您可以在marker.setIcon和mouseover上使用mouseout：

google.maps.event.addListener(marker, 'mouseover', function() {
    marker.setIcon('http://i.stack.imgur.com/t7vAK.png');
});
google.maps.event.addListener(marker, 'mouseout', function() {
    marker.setIcon('http://i.stack.imgur.com/TrIat.png');
});

演示：http://jsfiddle.net/mzu2qte5/2/

这个解决方案的一个小问题是“Hello World＆＃39;图标应放在图标的中间，而不是像现在一样向左移动。

这样你松散＆＃39;扩展＆＃39;效果。