[英]load google map without using callback method
i have multiple google map instances on my website,now there are two different google map on a same page, what happens is the first one works and other doesn't now i know the logical issue let me show you my code first我的网站上有多个谷歌地图实例,现在同一页面上有两个不同的谷歌地图,第一个有效,另一个无效,现在我知道逻辑问题让我先向您展示我的代码
<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>
now as i defined a callback method it always initializes the method named initMap whereas what i want to do is there can be multiple google maps lets suppose initMap2 how can i load them without callback method?现在,当我定义一个回调方法时,它总是初始化名为initMap的方法,而我想要做的是可以有多个谷歌地图让我们假设initMap2如何在没有回调方法的情况下加载它们?
To load the map without a callback, load the API synchronously/inline (without the async defer
), then call your initMap function on the load event.要在没有回调的情况下加载地图,请同步/内联加载 API(不带async defer
),然后在加载事件上调用 initMap 函数。
( Note: FYI: Google changed all their examples to using asynchronous loading to improve the load times) (注意:仅供参考:Google 将所有示例更改为使用异步加载来缩短加载时间)
( Note2: Google has added a "sample" to their documentation describing synchronous loading ) (注 2: Google 已在其描述同步加载的文档中添加了“示例” )
proof of concept fiddle概念证明小提琴
code snippet:代码片段:
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?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk"></script> <div id="map"></div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.