改变谷歌地图标记图标与不同的地方

Change of Google map marker icon with different places

本文关键字：图标 谷歌 地图 改变      更新时间：2023-09-26

我有两个位置。我想用外部图像更改两个位置的标记图标。但在当前的代码中，两个地方都采用相同的图像。请帮忙吗？

    var markers = [
     ['Sydney', lat,long],
     ['New York', lat,long],

    function initializeMaps() {
    var myOptions = {
    zoom: 3,
    center: new google.maps.LatLng(lat, long),
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    mapTypeControl: false
};
var image = 'img/logos.png';
var map = new google.maps.Map(document.getElementById("map_canvas"),myOptions);
var infowindow = new google.maps.InfoWindow(), marker, i;
for (i = 0; i < markers.length; i++) {  

    marker = new google.maps.Marker({
        position: new google.maps.LatLng(markers[i][1], markers[i][2]),
        map: map,
    icon: image
    });
    google.maps.event.addListener(marker, 'click', (function(marker, i) {
        return function() {
            infowindow.setContent(markers[i][0]);
            infowindow.open(map, marker);
        }
    })(marker, i));
}

}

您只定义了一个图像，

为每个loc添加图像到数组中，然后使用标记[i][3]访问它（如果您将其放在末尾）。

这应该有效：

var markers = [
     ['Sydney', lat,long, 'url-to-image'],
     ['New York', lat,long, 'url-to-image'],

    function initializeMaps() {
    var myOptions = {
    zoom: 3,
    center: new google.maps.LatLng(lat, long),
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    mapTypeControl: false
};
//var image = 'img/logos.png';
var map = new google.maps.Map(document.getElementById("map_canvas"),myOptions);
var infowindow = new google.maps.InfoWindow(), marker, i;
for (i = 0; i < markers.length; i++) {  

    marker = new google.maps.Marker({
        position: new google.maps.LatLng(markers[i][1], markers[i][2]),
        map: map,
    icon: markers[i][3]
    });
    google.maps.event.addListener(marker, 'click', (function(marker, i) {
        return function() {
            infowindow.setContent(markers[i][0]);
            infowindow.open(map, marker);
        }
    })(marker, i));
}
}
相关文章：