Question

下面是我的代码，如果可能的话我想要第3个设置（Link，Coordinates，Icon）并将其添加到循环中。每所大学都应该有一个独特的图标。

请参阅下面的数组。

var markers = [
    ['<a href="http://www.ship.edu">Shippensburg University</a>', 40.06090, -77.52148],
    ['<a href="http://www.millersville.edu">Millersville University</a>', 39.99680, -76.35440],
    ['Kutztown University', 40.50980, -75.78410],
];


function initialize() {
    var latlng = new google.maps.LatLng(40.9, -77.5);
    var myOptions = {
        zoom: 7,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.TERRAIN,
        mapTypeControl: false
    };
    var map = new google.maps.Map(document.getElementById("gmap"),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: '../university.png'
        });
        google.maps.event.addListener(marker, 'click', (function(marker, i) {
            return function() {
                infowindow.setContent(markers[i][0]);
                infowindow.open(map, marker);
            }
        })(marker, i));
    }
}

google.maps.event.addDomListener(window, 'load', initialize);

Answer 1

你可以简单地添加第四项吗？

var markers = [
    ['<a href="http://www.ship.edu">Shippensburg University</a>', 40.06090, -77.52148, '../university.png'],
    ...
];

和

marker = new google.maps.Marker({
        position: new google.maps.LatLng(markers[i][1], markers[i][2]),
        map: map,
        icon: markers[i][3]
    });

虽然，我建议给出属性名称（而不是转储吨数组）以使代码更具可读性：

var markers = [
    { 
        link: '<a href="http://www.ship.edu">Shippensburg University</a>', 
        lat: 40.06090, lng: -77.52148, 
        icon: '../university.png']
    },
    { ... }
];

和

marker = new google.maps.Marker({
        position: new google.maps.LatLng(markers[i].lat, markers[i].lng),
        map: map,
        icon: markers[i].icon
    });

Gmaps Api 3为阵列中的标记设置单独的图标

1 个答案: