Pis*_*hai 4 javascript google-maps google-maps-api-3
哎呀!有些不对劲.此页面未正确加载Google地图.有关技术详细信息,请参阅JavaScript控制台
我不知道为什么
API错误:RefererNotAllowedMapError
<!DOCTYPE html>
<html>
<head>
<title>Simple Map</title>
<meta name="viewport" content="initial-scale=1.0">
<meta charset="utf-8">
<style>
html, body {
height: 100%;
margin: 0;
padding: 0;
}
#map {
height: 100%;
}
</style>
</head>
<body>
<div id="map"></div>
<script>
var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: {lat: -34.397, lng: 150.644},
zoom: 8
});
}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=myAPI&callback=initMap"
async defer></script>
</body>
</html>Run Code Online (Sandbox Code Playgroud)
请查看Google maps api教程:https: //developers.google.com/maps/documentation/javascript/tutorials/adding-a-google-map
仔细阅读时,您会看到需要一个密钥YOUR_API_KEY
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap">
</script>
Run Code Online (Sandbox Code Playgroud)
要获取密钥,请访问:https://developers.google.com/maps/documentation/javascript/tutorials/adding-a-google-map#key
小智 1
用这个替换你的 googleApi 地图插件...
“ https://maps.googleapis.com/maps/api/js?sensor=false&callback=initMap ”
<!DOCTYPE html>
<html>
<head>
<title>Simple Map</title>
<meta name="viewport" content="initial-scale=1.0">
<meta charset="utf-8">
<style>
html, body {
height: 100%;
margin: 0;
padding: 0;
}
#map {
height: 100%;
}
</style>
</head>
<body>
<div id="map"></div>
<script>
var map;
function initMap() {
map = new google.maps.Map(document.getElementById('map'), {
center: {lat: -34.397, lng: 150.644},
zoom: 8
});
}
</script>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false&callback=initMap"></script>
</body>
</html>Run Code Online (Sandbox Code Playgroud)
希望对你有帮助。