加載谷歌地圖，而不使用回調方法

Question

我在我的網站上有多個谷歌地圖實例，現在有兩個不同的谷歌地圖在同一頁上，會發生什麼是第一個作品和其他不現在我知道邏輯問題讓我告訴你我的代碼第一

<script> 
    function initMap() { 
     var myLatLng = {lat: 43.6222102, lng:-79.6694881}; 

     var map = new google.maps.Map(document.getElementById('map'), { 
      zoom: 15, 
      center: myLatLng 
     }); 

     var marker = new google.maps.Marker({ 
      position: myLatLng, 
      map: map, 
     }); 
    } 
</script> 
<script src="https://maps.googleapis.com/maps/api/js?key=my_key&callback=initMap" 
     async defer></script> 

現在我定義它總是初始化命名initMap的方法，而我想做的事就是可以有多個谷歌地圖可以假設的回調方法initMap2我該如何加載m沒有回調方法？

Answer 1

要加載沒有回調的地圖，請同步/內聯加載API（不包含async defer），然後在加載事件中調用initMap函數。

proof of concept fiddle

代碼片段：

function initMap() { 
 
    var myLatLng = { 
 
    lat: 43.6222102, 
 
    lng: -79.6694881 
 
    }; 
 

 
    var map = new google.maps.Map(document.getElementById('map'), { 
 
    zoom: 15, 
 
    center: myLatLng 
 
    }); 
 

 
    var marker = new google.maps.Marker({ 
 
    position: myLatLng, 
 
    map: map, 
 
    }); 
 
} 
 
google.maps.event.addDomListener(window, 'load', initMap);

html, 
 
body, 
 
#map { 
 
    height: 100%; 
 
    width: 100%; 
 
    margin: 0px; 
 
    padding: 0px 
 
}

<script src="https://maps.googleapis.com/maps/api/js"></script> 
 
<div id="map"></div>