無法使用 Google map javascript api v3 在 Google 地圖上設置多個標記

Question

我想在 map 上放置多個標記，但我得到一個沒有設置標記的 map。

<script type="text/javascript">

  var map;
  var i;

  window.onload=function()
  {
    var mapOptions = {
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP,
      center: new google.maps.LatLng(59.32522, 18.07002)
    };

    map = new google.maps.Map(document.getElementById("map"),mapOptions);
    var bounds = new google.maps.LatLngBounds();
         var places =[];
         places.push(google.maps.LatLng(40.756,-73.986));
         places.push(google.maps.LatLng(59.32522, 18.07002));
         places.push(google.maps.LatLng(37.775,-122.419));
         places.push(google.maps.LatLng(47.620,-122.347));
         places.push(google.maps.LatLng(-22.933,-43.184));
         for(i=0; i<places.length;i++)
      {
          var marker= new google.maps.Marker({position:places[i],map: map,title:'place Number'+i});

        bounds.extend(places[i]);

      }
      map.fitBounds(bounds);
  }
</script>

Answer 1

您可以編寫 javascript function 並在填充結果后調用。 您也可以使用 json 將數據從服務器端推送到 javascript

function showMap(locations){  
    //map code here
}

Answer 2

您需要更改所有如下所示的行：

     places.push(google.maps.LatLng(40.756,-73.986));

看起來像這樣：

     places.push(new google.maps.LatLng(40.756,-73.986));

這是您上面的代碼以及這些修改。 它對我有用。 試試看：

<script type="text/javascript">

  var map;
  var i;

  window.onload=function()
  {
    var mapOptions = {
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP,
      center: new google.maps.LatLng(59.32522, 18.07002)
    };

    map = new google.maps.Map(document.getElementById("map"),mapOptions);
    var bounds = new google.maps.LatLngBounds();
         var places =[];
         places.push(new google.maps.LatLng(40.756,-73.986));
         places.push(new google.maps.LatLng(59.32522, 18.07002));
         places.push(new google.maps.LatLng(37.775,-122.419));
         places.push(new google.maps.LatLng(47.620,-122.347));
         places.push(new google.maps.LatLng(-22.933,-43.184));
         for(i=0; i<places.length;i++)
      {
          var marker= new google.maps.Marker({position:places[i],map: map,title:'place Number'+i});

        bounds.extend(places[i]);

      }
      map.fitBounds(bounds);
  }
</script>