在同一页面上有两个不同的Google API，但可以获得您在此页面上多次包含Google Maps API错误

Question

我试图在同一页面上包含两个不同的Google API，但出现错误

您已在此页面上多次包含Google Maps API。

具体来说，我试图使用谷歌的自动完成和距离矩阵API。我只能在单个页面上工作，因为我无法拨打maps.googleapis.com两次。但是，我必须调用不同的链接扩展名（即callback=initAutocomplete和callback=initMap），所以我不确定如何解决此问题。这两个链接如下：

<script src="https://maps.googleapis.com/maps/api/js?key=MyPrivateKey=&libraries=places&callback=initAutocomplete" async defer></script> 

<script src="https://maps.googleapis.com/maps/api/js?key=MyPrivateKey4&callback=initMap" async defer></script> 

有谁知道如何通过一个脚本调用访问自动完成和Map API？谢谢！

Answer 1

通常，callback函数在Google地图（如果请求加载所有库）完全加载并可以使用时调用。因此，你可以把initAutoComplete在initMap像

<script> 
    var map; 
    function initMap(){ 
     // initiate a new map instance. 
     map = new google.maps.Map(document.getElementById('map'), { 
      zoom: 12, 
      center: {lat: 15.3647, lng: 75.1240} 
     }); 
     initAutocomplete(); // initiate Auto complete instance 
    } 
    fucntion initAutocomplete(){ 
     // code to handle autocomplete 
    } 
</script> 
<script src="https://maps.googleapis.com/maps/api/js?key=<key>&libraries=places&callback=initMap" async defer></script>