如何在Google地图上显示自定义DIV元素作为标记？ [英] How can I show a custom DIV element on a google map as a marker?

问题描述

我希望能够在Google Map（V3 API）上显示自定义的DIV元素作为标记，但它似乎只允许使用图片来代替。有没有什么方法可以使用标准的Google地图API？

这里有一个很棒的小图书馆： RichMarker 。其文档此处。

您可以使用传递给构造函数的json对象的 content 属性，如下所示：

  var marker = new RichMarker（{
 position：yourLatLng，
 map：yourMap，
 content：'< ; div class =my-flexible-marker>初始内容< / div>'
}）; 
  

然后用 setContent 方法：



  marker.setContent（'< div class =my-flexible-marker>新内容< / div> ;'）; 
  




I want to be able to show a custom DIV element on a Google Map (V3 API) as a marker but it only seems to allow images to be used instead. Is there any way around this using the standard google map API?

解决方案

Here's an excellent little library: RichMarker. Its documentation is here.

You can use the content property of the json object passed to the constructor like this:

var marker = new RichMarker({
      position: yourLatLng,
      map: yourMap,
      content: '<div class="my-flexible-marker">initial content</div>'
});

And later change the content with the setContent method:

marker.setContent('<div class="my-flexible-marker">new content</div>');

这篇关于如何在Google地图上显示自定义DIV元素作为标记？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！