image - 如何在谷歌地图 api v3 map 中为鼠标光标设置自定义图像

Question

我想在将鼠标悬停在页面上的谷歌地图组件上时有一个自定义光标。我希望能够以编程方式将光标更改为自定义图像，然后将其更改回默认光标。

我相信这就是您在“ map ”对象上设置默认光标的方式

 map.setOptions({ draggableCursor: 'default' });

经过一些研究和实验，我发现最好的方法如下:

 map.setOptions({ draggableCursor: 'url(path/to/your/image.png), crosshair' });

在 css 中，只有 webkit 支持 cursor 属性的 url 值，所以其他浏览器在这种情况下会获取 'crosshair' 的值，这解决了我需要通知用户他们需要点击 map 的问题。

有关 draggableCursor 属性的更多信息，请参阅此处的 google maps api v3 文档: http://code.google.com/apis/maps/documentation/javascript/reference.html#MapOptions

希望这可以帮助在谷歌地图上设置自定义光标时遇到问题的人。

Answer 1

在 mac 上，它可以在 chrome、safari 和 firefox 上完美运行。

我只是使用这个:

map.setOptions({ draggableCursor : "url(http://s3.amazonaws.com/besport.com_images/status-pin.png), auto" })

ps:我在某处读到你需要你的图像在某些浏览器上低于 64x64。永远不必尝试，但也许您的问题来自于此。