如何在谷歌地图中的标记上添加用户图像？

Question

我正在制作一个角度应用，我要求用户个人资料图片在谷歌地图上显示为标记。

该位置来自一个带有Lat的JSON的API，长和用户的图像。 另外，我在地图中使用聚类。每当我单击群集时，都会出现带有图像的标记。

我正在尝试AGM地图库以及Google Maps Javascript API 有办法吗？

Answer 1

如果您不想使用谷歌地图默认标记，并希望将自定义HTML添加到标记， 检查此插件 - https://github.com/googlemaps/js-rich-marker
非常简单的插件使用HTML作为谷歌地图标记。

注意 - 基本上这个插件使用自定义叠加作为标记。所以，与默认的谷歌地图标记相比，我认为使用这个可以让地图变得有点沉重，当有很多标记时（特别是在智能手机上）

Answer 2

使用自定义标记并使用您自己的图像。您只需将图片的网址传递到icon对象的Marker属性，如下所示......

var marker = new google.maps.Marker({
        position: point,
        icon: 'http://contoso.com/image.png',
        map: map
      });

如果您需要对该图像及其渲染方式进行更多控制。 Google Maps API提供了icon object specification您可以使用

var icon = {
    url: 'http:contoso.com/image.png',
    anchor: new google.maps.Point(0, 0)
}

Google Maps APIs网站

中有很多文档和示例