Question

显示地图之前有效，但由于某种原因，我无法确定它已停止工作。

这是我的html包含：

<script async defer
        src="https://maps.googleapis.com/maps/api/js?key=THIS_KEY_IS_CORRECT">
  </script>

这是我的HTML：

(with style tags)
#map { height: 500px; }

<div id="map" > </div>

我的javascript

        setTimeout(() => {
            console.log("Running init map");
            var map_div = document.getElementById("map");
            var map_handler = new google.maps.Map(map_div, map_options);
            console.log(map_handler);
        },2000);

以下是map_handler的控制台日志：

ug {__gm: Yf, W: undefined, mapTypes: Object, features: Object, overlayMapTypes: _.td…}

所以map_handler实际上正在返回一些东西。

正如我所说，这曾经工作。由于某种原因，它不再存在。

知道为什么吗？

非常感谢。

Answer 1

虽然这不是您问题的主要来源 - 但请注意，您无法依赖setTimeout告诉您何时加载了Google地图JS API。使用回调：

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

然后

<script>

 var myMapIsReady = function() {
            console.log("Running init map");
            var map_div = document.getElementById("map");
            var map_handler = new google.maps.Map(map_div, map_options);
            console.log(map_handler);  
 };

</script>

在这里，问题是，你为什么说这不起作用？如何不起作用？你在屏幕上看到了什么？

提示可能是map_options你没有显示定义的位置，如果你创建一个没有中心latlng / zoom的谷歌地图，你只会看到一个灰色的块。

未显示Google Maps API（固定高度/宽度无法解决）

1 个答案: