2013-08-19 60 views
-3

下面是我的代码,如果可能,我想要第三个设置(链接,坐标,图标)并将其添加到循环中。每所大学都应该有一个独特的图标。Gmaps Api 3为数组中的标记设置单个图标

看到我下面的数组。

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); 

回答

0

您可以简单地添加第四项?

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 
    }); 
相关问题