Javascript 无法在我的地理位置api结果中获取*MAP*
我得到了正确的纬度和经度位置，但谷歌地图在我的文档中不可见，尽管我的api键是正确的我无法在结果中获取谷歌地图Javascript 无法在我的地理位置api结果中获取*MAP*,javascript,html,google-maps,geolocation,Javascript,Html,Google Maps,Geolocation,我得到了正确的纬度和经度位置，但谷歌地图在我的文档中不可见，尽管我的api键是正确的我无法在结果中获取谷歌地图 帮助我解决这个问题，通过谷歌地图获得纬度和经度……这是一个简单的html文档，带有内部css和java脚本文件。 为什么我没有地图？？ 这是我的密码 <!DOCTYPE html> <html> <head> <title>location map</title> <style>
帮助我解决这个问题，通过谷歌地图获得纬度和经度……这是一个简单的html文档，带有内部css和java脚本文件。 为什么我没有地图？？ 这是我的密码
<!DOCTYPE html>
<html>
<head>
<title>location map</title>
<style>
*{
padding: 0;margin: 0;
}
body{
width: 100%;
height: 100%;
}
#button-layer{
width: 500px;
height: 200px;
margin: 10px;
text-align:center;
margin: auto;
}
#map-button{
font-size: 30px;
color: red;
background-color: yellow;
font-weight: bold;
width: 300px;
height: 60px;
margin: 10px;
text-align: center;
border: 2px solid black;
}
#map{
height: 100%;
width: 100%;
}
p{
text-align:center;
font-size: 30px;
font-weight: bold;
}
</style>
</head>
<body>
<h1><center>get your current location</center></h1>
<br><br>
<div id="button-layer">
<button id="map-button" type="button" onclick="locate()">my current
location</button>
</div>
<p id="demo"></p>
<div id="map"></div>
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=********-
nRPS4GJX4z3HKc3YmH8jjdCXE&callback=initMap">
</script>
<script >
var map;
function initMap() {
var mapLayer = document.getElementById("map");
var centerCoordinates = new google.maps.LatLng(37.6, -95.665);
var defaultOptions = { center: centerCoordinates, zoom: 4 }
map = new google.maps.Map(mapLayer, defaultOptions);
}
var x= document.getElementById("demo");
function showLocation(position){
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
x.innerHTML="latitude:"+latitude+"and longitude:"+longitude;
var infoWindowHTML = "latitude:"+latitude+"<br> longitude:"+longitude;
var infoWindow = new google.maps.InfoWindow({map: map, content: infoWindowHTML});
var currentLocation = { lat:latitude, lng:longitude };
infoWindow.setPosition(currentLocation);
document.getElementById("map-button").style.display = 'none';
}
function errorHandler(err){
if(err.code==1){
alert("Error: Access is denied!");
}
else if(err.code==2){
alert("Error: Position is unavailable!");
}
}
function locate(){
document.getElementById("map-button").disabled=true;
document.getElementById("map-button").innerHTML="processing..."
if(navigator.geolocation){
navigator.geolocation.getCurrentPosition(showLocation,errorHandler);
}
else{
x.innerHTML="geolocation is not supported in this browser";
}
}
</script>
位置图
*{
填充：0；边距：0；
}
身体{
宽度：100%；
身高：100%；
}
#按钮层{
宽度：500px；
高度：200px；
利润率：10px；
文本对齐：居中；
保证金：自动；
}
#地图按钮{
字体大小：30px；
颜色：红色；
背景颜色：黄色；
字体大小：粗体；
宽度：300px；
高度：60px；
利润率：10px；
文本对齐：居中；
边框：2件纯黑；
}
#地图{
身高：100%；
宽度：100%；
}
p{
文本对齐：居中；
字体大小：30px；
字体大小：粗体；
}
获取当前位置
我的电流
位置
var映射；
函数initMap（）{
var mapLayer=document.getElementById（“map”）；
var centerCoordinates=new google.maps.LatLng（37.6，-95.665）；
var defaultOptions={中心：中心坐标，缩放：4}
map=新的google.maps.map（mapLayer，defaultOptions）；
}
var x=document.getElementById（“演示”）；
功能显示位置（位置）{
变量纬度=位置坐标纬度；
var经度=position.coords.longitude；
x、 innerHTML=“纬度：“+纬度+”和经度：“+经度；
var infoWindowHTML=“纬度：“+纬度+”
经度：“+经度；
var infoWindow=new google.maps.infoWindow（{map:map，content:infoWindowHTML}）；
var currentLocation={lat:纬度，lng:经度}；
infoWindow.setPosition（当前位置）；
document.getElementById（“映射按钮”）.style.display='none'；
}
函数errorHandler（err）{
如果（错误代码==1）{
警报（“错误：访问被拒绝！”）；
}
else if（错误代码==2）{
警报（“错误：位置不可用！”）；
}
}
函数locate（）{
document.getElementById（“映射按钮”）.disabled=true；
document.getElementById（“映射按钮”）.innerHTML=“处理…”
if（导航器.地理位置）{
navigator.geolocation.getCurrentPosition（showLocation，errorHandler）；
}
否则{
x、 innerHTML=“此浏览器不支持地理位置”；
}
}
只需将您的密钥放在此处，并检查控制台日志中的错误，这样您就可以看到哪里出了问题。请提供一个包含所有必需HTML/CSS的列表。您的带有is=“demo”的