Javascript 未捕获引用错误：google未在google.maps.Marker（）中定义 var用户lat、用户lng； var映射； 函数initMap（）{ map=new google.maps.map（document.getElementById（'map'）{ 中心：{lat:17，lng:80}， 缩放：5 }); } var marker=new google.maps.marker({ 位置：{lat:17，lng:80}， 地图：地图， 标题：“你好，世界！” });

这是为了测试目的。我必须在另一个代码中使用这个概念。请帮忙

这可能是重复的。有许多其他的帖子都报告了同样的错误，但是没有一个答案解决了我的问题

---

地图正在加载，没有任何问题。执行initMap（）函数。但是标记部分不会出现。

因为您有

async

和

defer

属性，所以api库的执行会延迟。定义

marker

时，浏览器仍未加载库，因此未定义

google.maps.marker

将代码移动到

initMap（）

函数中定义标记的位置，它应该可以工作

<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>

html，
身体，
#地图{
身高：100%；
宽度：100%；
}

---

您使用

async

标志加载脚本。这意味着浏览器不会等待此脚本完成加载

在执行

新的google.maps.Map（

）时，它仍然没有加载，并且执行失败。从

脚本

标记中删除

异步延迟

标志，并使其同步加载

如果希望异步加载脚本，则需要使用

callback

函数

<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>