Javascript 未捕获的 ReferenceError：google 未在 google.maps.Marker() 中定义
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/33495879/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Uncaught ReferenceError: google is not defined at google.maps.Marker()
提问by Krishna
<script src="https://maps.googleapis.com/maps/api/js?key=[KEY]&callback=initMap"
async defer></script>
<script>
var user_lat,user_lng;
var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: {lat:17, lng: 80},
zoom: 5
});
}
var marker = new google.maps.Marker({
position: {lat:17,lng:80},
map: map,
title: 'Hello World!'
});
</script>
This is for testing purpose. I have to use this concept in another code. kindly help this.
这是为了测试目的。我必须在另一个代码中使用这个概念。请帮助这个。
This may be found as duplicate. There are many other posts which report same error, but none of the answers solved my problem.
这可能是重复的。还有许多其他帖子报告了同样的错误，但没有一个答案解决了我的问题。
Map is loading without any problem. initMap() function is executed. But the marker part is not coming.
地图加载没有任何问题。initMap() 函数被执行。但是标记部分不会出现。
回答by Lucius
Since you have asyncand deferattributes, execution of the api library is deferred. When markeris being defined, the browser still haven't load the library, so google.maps.Markeris not defined.
由于您拥有async和defer属性，api 库的执行被推迟。当marker被定义，浏览器仍然没有加载库，所以google.maps.Marker没有定义。
Move the code where marker is defined inside initMap()function and it should work.
移动在initMap()函数内部定义标记的代码，它应该可以工作。
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAVD0ngfhOFs5rnww7UFyz9rN6UznOIZ1U&callback=initMap" async defer></script>
<script>
var user_lat,user_lng;
var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: {lat:17, lng: 80},
zoom: 5
});
var marker = new google.maps.Marker({
position: {lat:17,lng:80},
map: map,
title: 'Hello World!'
});
}
</script>
var user_lat, user_lng;
var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: {
lat: 17,
lng: 80
},
zoom: 5
});
var marker = new google.maps.Marker({
position: {
lat: 17,
lng: 80
},
map: map,
title: 'Hello World!'
});
}html,
body,
#map {
height: 100%;
width: 100%;
}<script src="https://maps.googleapis.com/maps/api/js?callback=initMap" async defer></script>
<div id="map"></div>回答by Yeldar Kurmangaliyev
You load your script with asyncflag. It means that a browser will not wait until this script will finish loading.
你用async标志加载你的脚本。这意味着浏览器不会等到这个脚本完成加载。
At the time of executing your new google.maps.Map(, it is still not loaded, and execution fails. Remove async deferflags from your scripttag and make it load synchronously.
在执行您的 时new google.maps.Map(，它仍然没有加载，并且执行失败。async defer从您的script标签中删除标志并使其同步加载。
If you want the script to be loaded asynchronously, you need to use callbackfunction.
如果要异步加载脚本，则需要使用callback函数。
