Javascript Google地图标记自定义，通过Google.maps.SymbolPath.CIRCLE

我正在使用谷歌地图制作我的地图，并在地图中显示标记，正如我之前使用的地图框一样，我们展示的地图标记在地图中显示，如下所示

但是，通过使用谷歌地图作为标记，我使用google.maps.SymbolPath.CIRCLE作为圆形标记

但在我的案例中，有几次我想使用正方形标记，标记中有一些文本

我如何才能做到这一点，是否有任何特殊的图书馆，我必须使用这个案件

请参考此屏幕截图和相关指南。

---

您可以为定义自定义路径。下面是一个基于的示例。你可以加上

代码片段：

函数initMap（）{
var map=new google.maps.map（document.getElementById（'map'）{
缩放：6，
中心：{
lat:21.5，
液化天然气：153.027
},
mapTypeId:google.maps.mapTypeId.TERRAIN
});
//定义自定义符号。所有符号都通过SVG路径表示法定义。
var平方={
路径：“M-2，-22，-22,2-2,2z'，/”M-2,0，-22,0,2z'，
strokeColor:“#F00”，
填充颜色：'#F00'，
不透明度：1，
比例：5
};
var marker=new google.maps.marker({
职位：{
lat:21.5，
液化天然气：153.027
},
地图：地图，
图标：正方形，
标签：{
文本：“X”，
fontWeight：“粗体”
}
});
var-toggle=false；
google.maps.event.addListener（标记，'click'，函数（evt）{
如果（！切换）{
这个是.setLabel({
文本：“X”，
颜色：“白色”，
fontWeight：“粗体”
});
}否则{
这个是.setLabel({
文本：“X”，
颜色：“黑色”，
fontWeight：“粗体”
});
}
切换=！切换；
});
}
google.maps.event.addDomListener（窗口“加载”，initMap）
html，
身体，
#地图{
身高：100%；
宽度：100%；
边际：0px；
填充：0px
}


var square = {
    path: 'M -2,-2 2,-2 2,2 -2,2 z', // 'M -2,0 0,-2 2,0 0,2 z',
    strokeColor: '#F00',
    fillColor: '#F00',
    fillOpacity: 1,
    scale: 5
  };
  var marker = new google.maps.Marker({
    position: {lat: 21.5, lng: 153.027},
    map: map,
    icon: square,
      label: {
      text:"X",
      fontWeight: "bold"
    }
  });