javascript 谷歌地图api点标记
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13857657/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Google maps api dot marker
提问by user1736982
Currently I use a StyledMarker icon (the default bubble icon with custom colors), but I've seen that some sites use the more compact "dot" (picture of dot marker). My question is if it is possbile to replace the default bubble marker with the dot using StyledMarker? If not, how can I solve it (by the way the solution must allow dynamic coloring of the dots)?
目前我使用 StyledMarker 图标（带有自定义颜色的默认气泡图标），但我已经看到一些网站使用更紧凑的“点”（点标记图片）。我的问题是是否可以使用 StyledMarker 用点替换默认气泡标记？如果没有，我该如何解决（顺便说一下，解决方案必须允许点的动态着色）？
回答by ffflabs
You can declare the marker icon to be a symboland customize it accordingly.
您可以将标记图标声明为符号并相应地对其进行自定义。
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
}
});
You can play with each property to achieve the desired look.
您可以使用每个属性来获得所需的外观。
If you want something more elaborate, I made (diclaimer: It was me, as in I made it) a library to use icon fonts (such as font-awesome or material icons) to render images(using an auxiliar canvas, then getting its dataurl).
如果你想要更复杂的东西，我做了（免责声明：是我，就像我做的那样）一个库来使用图标字体（例如字体真棒或材料图标）来渲染图像（使用辅助画布，然后获取它的数据网址）。
It's basically an image factory which you can use as
它基本上是一个图像工厂，您可以将其用作
new google.maps.Marker({
map: map,
position: map.getCenter(),
icon: MarkerFactory.autoIcon({
label: 'f1b9',
font: 'FontAwesome',
color: '#CC0000',
fontsize: 20
})
});
You can even omit the fontproperty and it will render the literal text you pass it. I use this to enumerate the markers sometimes.
您甚至可以省略该font属性，它会呈现您传递给它的文字文本。我有时用它来枚举标记。
回答by geocodezip
The StyledMarkeruses the (deprecated) Chart Images APIfor its icons. It looks like that doesn't have a "measle"/dot in it (but look for yourself). In any case, from a quick look, it natively only supports these two:
该StyledMarker使用（不推荐）表图像API为它的图标。看起来它里面没有“麻疹”/点（但你自己找找）。无论如何，粗略看一下，它本身只支持这两个：
- d_map_xpin_letter
- d_map_pin_letter
- d_map_xpin_letter
- d_map_pin_letter
It is open source, so you can modify it to do whatever you want, but you might just have to use "normal" custom markersto get "measles".
它是开源的，所以你可以修改它来做你想做的任何事情，但你可能只需要使用“普通”自定义标记来获取“麻疹”。
回答by moooeeeep
You could draw yourself a dot using a customized circle: https://developers.google.com/maps/documentation/javascript/examples/circle-simple
您可以使用自定义圆圈为自己画一个点：https: //developers.google.com/maps/documentation/javascript/examples/circle-simple
