我在一些谷歌地图定制方面做得相当不错;但我想知道我可以在下面添加哪里/或添加什么来简单地更改 map 标记/图钉/或图标。我真的只是想改变颜色;但如果必须的话,我会创建一个图像并这样做。
以下是我正在使用的内容;干杯/
window.onload = function() {
function initialize() {
var stylez = [
{
featureType: "all",
stylers: [
{ hue: "#c3c367" },
{ saturation: -75 }
]
},
{
featureType: "poi",
elementType: "label",
stylers: [
{ visibility: "off" }
]
}
];
var latlng = new google.maps.LatLng(34.101958, -118.327925), // toggle per data
mapOptions = {
mapTypeControlOptions: {
mapTypeIds: [google.maps.MapTypeId.ROADMAP, "Edited"]
},
zoom: 14,
center: latlng
},
map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions),
styledMapType = new google.maps.StyledMapType(stylez, {name: "Edited"}),
marker = new google.maps.Marker({
position: latlng,
map: map,
animation: google.maps.Animation.DROP,
title:"Hello World!"
}),
infowindow = new google.maps.InfoWindow({
content: "<div><img width='50' height='50' src='assets/icos/homico.png'</div>"
});
map.mapTypes.set("Edited", styledMapType);
map.setMapTypeId('Edited');
function toggleBounce () {
if (marker.getAnimation() != null) {
marker.setAnimation(null);
} else {
marker.setAnimation(google.maps.Animation.BOUNCE);
}
}
// Add click listener to toggle bounce
google.maps.event.addListener(marker, 'click', function () {
toggleBounce();
infowindow.open(map, marker);
setTimeout(toggleBounce, 1500);
});
}
// Call initialize -- in prod, add this to window.onload or some other DOM ready alternative
initialize();
};
最佳答案
您只需要添加
"icon": "url"
到您的标记声明。所以这:
marker = new google.maps.Marker({
position: latlng,
map: map,
animation: google.maps.Animation.DROP,
title:"Hello World!"
})
变成:
marker = new google.maps.Marker({
position: latlng,
map: map,
icon: yourIconUrl,
animation: google.maps.Animation.DROP,
title:"Hello World!"
})
关于google-maps - 添加自定义谷歌地图标记/别针(颜色),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20659565/