我见过很多类似的问题(这里，这里和这里)，但他们都接受了不能解决我的问题的答案。我发现这个问题的最佳解决方案是StyledMarker库，它允许您定义标记的自定义颜色，但我不能让它使用默认标记(当您做谷歌地图搜索时得到的-中间有一个点)，它似乎只是提供了一个字母标记，或一个特殊的图标。
当前回答
如果你使用谷歌地图API v3，你可以使用setIcon。
marker.setIcon('http://maps.google.com/mapfiles/ms/icons/green-dot.png')
或者作为标记init的一部分:
marker = new google.maps.Marker({
icon: 'http://...'
});
其他颜色:
蓝色标记 红色的标记 紫色标记 黄色的标记 绿色标记
使用下面的代码用不同的颜色更新默认标记。
(BitmapDescriptorFactory.defaultMarker(BitmapDescriptorFactory.HUE_ROSE)
其他回答
你可以使用这段代码，它工作得很好。
var pinImage = new google.maps.MarkerImage("http://www.googlemapsmarkers.com/v1/009900/");<br>
var marker = new google.maps.Marker({
position: yourlatlong,
icon: pinImage,
map: map
});
我扩展了一些vokimon的答案，使其更方便地更改其他属性。
function customIcon (opts) {
return Object.assign({
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 M -2,-30 a 2,2 0 1,1 4,0 2,2 0 1,1 -4,0',
fillColor: '#34495e',
fillOpacity: 1,
strokeColor: '#000',
strokeWeight: 2,
scale: 1,
}, opts);
}
用法:
marker.setIcon(customIcon({
fillColor: '#fff',
strokeColor: '#000'
}));
或者在定义一个新标记时:
const marker = new google.maps.Marker({
position: {
lat: ...,
lng: ...
},
icon: customIcon({
fillColor: '#2ecc71'
}),
map: map
});
将路径改为chart.googleapis.com，否则SSL将无法工作
你可以动态地请求图标图像从谷歌图表api与网址:
http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|FE7569
它看起来像这样:图像是21x34像素，针尖的位置是(10,34)
你还需要一个单独的阴影图像(这样它就不会重叠附近的图标):
http://chart.apis.google.com/chart?chst=d_map_pin_shadow
它看起来像这样:图像是40x37像素，针尖的位置(12,35)
当你构建你的MarkerImages时，你需要相应地设置大小和锚点:
var pinColor = "FE7569";
var pinImage = new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|" + pinColor,
new google.maps.Size(21, 34),
new google.maps.Point(0,0),
new google.maps.Point(10, 34));
var pinShadow = new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_pin_shadow",
new google.maps.Size(40, 37),
new google.maps.Point(0, 0),
new google.maps.Point(12, 35));
然后你可以添加标记到你的地图:
var marker = new google.maps.Marker({
position: new google.maps.LatLng(0,0),
map: map,
icon: pinImage,
shadow: pinShadow
});
只需将“FE7569”替换为您需要的颜色代码。例如:
归功于Jack B Nimble的灵感;)
使用swift和谷歌Maps Api v3，这是我能够做到的最简单的方法:
icon = GMSMarker.markerImageWithColor(UIColor.blackColor())
希望它能帮助到别人。
