目前我使用 StyledMarker 图标(具有自定义颜色的默认气泡图标),但我看到一些网站使用更紧凑的“点”( picture of dot marker )。我的问题是是否可以使用 StyledMarker 将默认气泡标记替换为点?如果没有,我该如何解决(顺便说一下,解决方案必须允许点的动态着色)?
最佳答案
您可以将标记图标声明为 symbol并相应地定制它。
new google.maps.Marker({
map: map,
position: map.getCenter(),
icon: {
path: google.maps.SymbolPath.CIRCLE,
fillColor: '#00F',
fillOpacity: 0.6,
strokeColor: '#00A',
strokeOpacity: 0.9,
strokeWeight: 1,
scale: 7
}
});
您可以使用每个属性来获得所需的外观。
如果你想要更精致的东西,我做了(免责声明: 是我,就像我做的一样 )a library to use icon fonts (such as font-awesome or material icons) to render images (使用辅助 Canvas ,然后获取其 dataurl)。
它基本上是一个图像工厂,您可以将其用作
new google.maps.Marker({
map: map,
position: map.getCenter(),
icon: MarkerFactory.autoIcon({
label: 'f1b9',
font: 'FontAwesome',
color: '#CC0000',
fontsize: 20
})
});
您甚至可以省略
font
属性,它将呈现您传递给它的文字文本。我有时用它来枚举标记。
关于javascript - 谷歌地图 api 点标记,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13857657/