使用新的Google Chart API的动态地图标记图标？

Question

多年来，我使用此处描述的Google Chart API在Javascript中创建了Google动态地图标记：

Dynamic icons

几天后，不再生成地图标记。链接顶部明确说明了这一点：
“ 警告：此API已弃用，并计划于2019年3月14日关闭。请改用主动维护的Google Charts API。”

它们到新的Google Chart API的链接并不能替代创建带有自定义颜色和自定义字母（我需要）的图标之类的地图标记。

我在新API中找到的最接近的是： Customizing Markers
但是在这里，唯一的选择是用自定义图片替换默认的Google标记。因此似乎没有动态生成标记。

也许我已经监督了一些事情，或者没有人知道创建谷歌地图的服务，例如其中带有字母和自定义颜色的标记。

Answer 1

我还注意到带有自定义颜色的图标消失了。 http://maps.google.com/mapfiles/ms/icons上似乎存储了一些预生成的图标，例如http://maps.google.com/mapfiles/ms/icons/green-dot.png

我设法找到了由Google托管的图标列表：https://sites.google.com/site/gmapsdevelopment/

Answer 2

在两者之间，我找到了一种解决方案，可以在标记内设置定义的颜色和标签。它不支持Google Chart API（仅适用于Google Maps API）。

解决方案的第一部分来自here（请参阅vokimon的答案）： 它采用SVG路径而不是预定义的图像（png）。这样，您可以定义自定义颜色（甚至在需要时定义more）

：

function createPin (color) {
        return {
            path: 'M 0,0 C -2,-20 -10,-22 -10,-30 A 10,10 0 1,1 10,-30 C 10,-22 2,-20 0,0 z',
            fillColor: color,
            fillOpacity: 1,
            strokeColor: '#000',
            strokeWeight: 2,
            scale: 1,
            labelOrigin: new google.maps.Point(0, -30)
        };
    }

“ labelOrigin”对于正确放置标签很重要。

现在您可以创建标记本身：

var marker = new google.maps.Marker({
   map: <yourMapInstance>,
   position: new google.maps.LatLng(<latitude>, <longitude>),
   icon: createPin('#F6AC01'),
   label: { 
            text: 'X',
            fontWeight: 'bold'
          },
});

here中描述了更多不错的标签选项。