Question

如何轻松更改图标的颜色？我只是想用googles标准标记将它改成不同的颜色？有没有办法我可以声明我用var = marker .....创建标记的颜色？

<script type="text/javascript"> 

var map = null;
function initialize() {
var myOptions = {
zoom: 5,
center: new google.maps.LatLng(54.2361100,-4.5480600),
mapTypeControl: true,
mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
navigationControl: true,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"),
                            myOptions);

google.maps.event.addListener(map, 'click', function() {
    infowindow.close();
    });

var point = new google.maps.LatLng(50.7184100,-3.5339000); 
  var marker = createMarker(point,'<div style="width:200px"><h2>text</h2><\/div>')


  var point = new google.maps.LatLng(50.9097000,-1.4043500);
  var marker = createMarker(point,'<div style="width:200px"><h2>text</h2><\/div>')

}

var infowindow = new google.maps.InfoWindow(
{ 
size: new google.maps.Size(150,50)
});

function createMarker(latlng, html) {
var contentString = html;
var marker = new google.maps.Marker({
    position: latlng,
    map: map,
    zIndex: Math.round(latlng.lat()*-100000)<<5
    });

google.maps.event.addListener(marker, 'click', function() {
    infowindow.setContent(contentString); 
    infowindow.open(map,marker);
    });
}



</script> 
</head> 
<body style="margin:0px; padding:0px;" onload="initialize()"> 
<div id="map_canvas" style="width: 535px; height: 500px"></div>

Answer 1

从这里How can I change the color of a Google Maps marker?调整肖恩的答案。

尝试将创建标记功能更改为

function createMarker(latlng, html, iconName) {
var contentString = html;
var marker = new google.maps.Marker({
    position: latlng,
    map: map,
    icon: iconName,
    zIndex: Math.round(latlng.lat()*-100000)<<5
});

然后用

调用它

var marker = createMarker(point,'<div style="width:200px"><h2>text</h2><\/div>', 'brown_markerA.png')

确保将所有图标放在与地图页面相同的位置。

然后，您可以调整为不同颜色或字母构建字符串的方式。

更改谷歌地图标记颜色

1 个答案: