谷歌地图标记 - 具有自定义颜色的图像

【问题标题】：google map markers - image with custom colors谷歌地图标记 - 具有自定义颜色的图像
【发布时间】：2014-12-21 05:03:17
【问题描述】：

我想使用 100 种不同颜色的马克笔。我可以通过复制和绘制 100 种颜色的标记来做到这一点，但如果可能的话，制作一个透明图像并在运行时绘制它会更容易，或者为每个标记动态构建 SVG。有哪些选择？

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

谢谢

【问题讨论】：

标签： google-maps svg google-maps-markers

【解决方案1】：

这行得通...

         var SVG_icon = {               
            path: 'M  0,0,  0,-40,  20,-30 , 0,-20,  z',                
            // set custom fillColor on each iteration
            fillColor: fillColour,
            fillOpacity: 0.7,
            scale: 1,
            strokeColor: 'black',
            strokeWeight: 2
          };

        // create marker and put it on map
        var marker = new google.maps.Marker({
            position: myLocation,
            icon: SVG_icon,
            map: map
        });

SVG 生成标志示例

【讨论】：