javascript - 谷歌地图 JavaScript API 问题
问题描述
我在这里关注谷歌的官方文档：https ://developers.google.com/maps/documentation/javascript/examples/map-simple 。
我正在尝试按照上述指南设置基本地图，但地图未呈现到页面。为澄清起见，地图 JavaScript API 已通过我的谷歌帐户启用，并且我已经测试了我的 API 密钥，该密钥可以正常工作。这是我的代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<h1>Google map API</h1>
<div id="map"></div>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="app.js"></script>
<!-- async defer in first script tag if needed -->
<script src="https://maps.googleapis.com/maps/api/js?key=MYAPIKEY&callback=initMap" async defer ></script>
</html>
JavaScript：
var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: { lat: -34.397, lng: 150.644 },
zoom: 10,
});
console.log("map", map);
};
这是控制台输出的屏幕截图：https ://postimg.cc/p5PsjqP1 控制台 中没有显示任何错误，但它是控制台记录地图变量。我在这里想念什么？为什么我的基本地图没有显示？