除了没有关键警告外,它不会显示任何错误或警告,但仍然不会在我的网页上显示地图。它只显示纬度和经度的文本值,这意味着 getlocation() 和 showposition() 正在工作。
`
<!DOCTYPE html>
<html>
<head>
<title>MY FORM</title>
</head>
<body>
<button onclick="getLocation()">trysd</button>
<div id="map"></div>
<script
type="text/javascript"
src="https://maps.googleapis.com/maps/api/js?v=3.exp&callback=Function.prototype"
></script>
<script>
let x = document.getElementById('map')
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition)
} else {
x.innerHTML = 'Geolocation is not supported by this browser.'
}
}
function showPosition(position) {
x.innerHTML =
'Latitude: ' +
position.coords.latitude +
'<br>Longitude: ' +
position.coords.longitude
var mapProp = {
center: new google.maps.LatLng(
position.coords.latitude,
position.coords.longitude
),
zoom: 5,
}
var map = new google.maps.Map(document.getElementById('map'), mapProp)
}
</script>
</body>
</html>
`
尝试使用 CSS 或内联样式向您的
width
元素添加固定的 height
和 <div id="map">
。
<head>
<style>
#map {
width: 800px;
height: 800px;
}
</style>
</head>