如何在Google地圖上創建多個標記100+

Question

我想在自定義地圖上顯示100個標記，我應該在單個標記代碼下面重複100次，並且有大量文件，或者有其他更緊湊的方法來創建多個標記嗎？

var marker = new google.maps.Marker({ 
       position: new google.maps.LatLng(34.052661,-118.269976), 
       title:"Hello World!", 
       map:map, 
       animation: google.maps.Animation.DROP 
      }); 

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

      var infowindow = new google.maps.InfoWindow({ 
       content: '<div id="content">'+ 
           '<div id="siteNotice">'+ 
           '</div>'+ 
           '<h1 id="firstHeading" class="firstHeading">Uluru</h1>'+ 
           '<div id="bodyContent">'+ 
           '<p><b>Uluru</b>, also referred to as <b>Ayers Rock</b>, is a large ' + 
           'sandstone rock formation in the southern part of the '+ 
           'Northern Territory, central Australia. It lies 335&#160;km (208&#160;mi) '+ 
           'south west of the nearest large town, Alice Springs; 450&#160;km '+ 
           '(280&#160;mi) by road. Kata Tjuta and Uluru are the two major '+ 
           'features of the Uluru - Kata Tjuta National Park. Uluru is '+ 
           'sacred to the Pitjantjatjara and Yankunytjatjara, the '+ 
           'Aboriginal people of the area. It has many springs, waterholes, '+ 
           'rock caves and ancient paintings. Uluru is listed as a World '+ 
           'Heritage Site.</p>'+ 
           '<p>Attribution: Uluru, <a href="http://en.wikipedia.org/w/index.php?title=Uluru&oldid=297882194">'+ 
           'http://en.wikipedia.org/w/index.php?title=Uluru</a> '+ 
           '(last visited June 22, 2009).</p>'+ 
           '</div>'+ 
          '</div>', 
      }); 

Answer 1

您可以創建你需要爲你的標記，並在循環遍歷所有這些數據對象的數組，因此您的代碼將更加緊湊和高效。

例如：

var myMarkers = new Array(
      {lat:34.052661, lng:-118.269976, title:"Hello World"}, 
      {lat:14.052661, lng:-108.269976, title:"Hello World 2"}, 
      {lat:14.052661, lng:-108.269976, title:"Hello World 3"}, //Continue... 
    ); 

//LOOP on marker data array 
for(var i = 0; i < myMarkers.length; i++){ 
    var currMarker = myMarker[i]; 
    var marker = new google.maps.Marker({ 
      position: new google.maps.LatLng(currMarker.lat,currMarker.lng), 
      title:currMarker.title, 
      map:map, 
      animation: google.maps.Animation.DROP 
     }); 

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

     var infowindow = new google.maps.InfoWindow({ 
      content: '<div id="content">'+ 
          '<div id="siteNotice">'+ 
          '</div>'+ 
          '<h1 id="firstHeading" class="firstHeading">Uluru</h1>'+ 
          '<div id="bodyContent">'+ 
          '<p><b>Uluru</b>, also referred to as <b>Ayers Rock</b>, is a large ' + 
          'sandstone rock formation in the southern part of the '+ 
          'Northern Territory, central Australia. It lies 335&#160;km (208&#160;mi) '+ 
          'south west of the nearest large town, Alice Springs; 450&#160;km '+ 
          '(280&#160;mi) by road. Kata Tjuta and Uluru are the two major '+ 
          'features of the Uluru - Kata Tjuta National Park. Uluru is '+ 
          'sacred to the Pitjantjatjara and Yankunytjatjara, the '+ 
          'Aboriginal people of the area. It has many springs, waterholes, '+ 
          'rock caves and ancient paintings. Uluru is listed as a World '+ 
          'Heritage Site.</p>'+ 
          '<p>Attribution: Uluru, <a href="http://en.wikipedia.org/w/index.php?title=Uluru&oldid=297882194">'+ 
          'http://en.wikipedia.org/w/index.php?title=Uluru</a> '+ 
          '(last visited June 22, 2009).</p>'+ 
          '</div>'+ 
         '</div>', 
     }); 
}