我试图使用地理编码服务,但由于某些原因,地图显示不出来。 当我检查了开发者控制台,它不显示任何JavaScript错误。
这是怎样的谷歌地图在镀铬显示出来。
<!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;
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script src="\div.js"></script>
[![enter image description here][1]][1]
<script>
google.maps.visualRefefresh = true;
var map;
function initialize() {
getCoordinates('287 West Center Street Utah', function(coords) {
var mapOptions = {
center: new google.maps.LatLng(coords[0],coords[1]),
zoom: 8
};
map = new google.maps.Map(document.getElementById('map'), mapOptions);
})
}
google.maps.event.addDomListener(window,'load',initialize);
</script>
</head>
<body>
<div id="map" style="height:100%"></div>
</body>
</html>
div.js
geocoder = new google.maps.Geocoder();
function getCoordinates(address,callback) {
var coordinates;
geocoder.geocode({address : address} , function (results,status){
coords_obj = results[0].geometry.location;
coordinates = [coords_obj.nb, coords_obj.ob];
callback(coordinates);
})
}
不要使用谷歌地图JavaScript API V3的无证特性 。 他们可以和你每次发布而改变。 始终使用记录的方法 (.lat(),.lng())。
工作拨弄
代码片段::
google.maps.visualRefefresh = true; var map; function initialize() { getCoordinates('287 West Center Street Utah', function(coords) { var mapOptions = { center: new google.maps.LatLng(coords[0], coords[1]), zoom: 8 }; map = new google.maps.Map(document.getElementById('map'), mapOptions); }) } google.maps.event.addDomListener(window, 'load', initialize); var geocoder = new google.maps.Geocoder(); function getCoordinates(address, callback) { var coordinates; geocoder.geocode({ address: address }, function(results, status) { coords_obj = results[0].geometry.location; coordinates = [coords_obj.lat(), coords_obj.lng()]; callback(coordinates); }) }
html, body { height: 100%; margin: 0; padding: 0; }
<script src="https://maps.googleapis.com/maps/api/js"></script> <div id="map" style="height:100%"></div>
编辑1
更改此:
function getCoordinates(address,callback) {
var coordinates;
geocoder.geocode({address : address} , function (results,status){
coords_obj = results[0].geometry.location;
coordinates = [coords_obj.nb, coords_obj.ob];
callback(coordinates);
})
}
为了这:
function getCoordinates(address,callback) {
var coordinates;
geocoder.geocode({address : address} , function (results,status){
coords_obj = results[0].geometry.location;
coordinates = [coords_obj.H, coords_obj.L];
callback(coordinates);
})
}
你的错误:坐标= [coords_obj.nb,coords_obj.ob];
编辑2
geocoder = new google.maps.Geocoder(); function getCoordinates(address, callback) { var coordinates; geocoder.geocode({ address: address }, function(results, status) { coords_obj = results[0].geometry.location; console.log(coords_obj) coordinates = [coords_obj.H, coords_obj.L]; callback(coordinates); }) } google.maps.visualRefefresh = true; var map; function initialize() { getCoordinates('287 West Center Street Utah', function(coords) { var mapOptions = { center: new google.maps.LatLng(coords[0], coords[1]), zoom: 8 }; console.log(mapOptions) map = new google.maps.Map(document.getElementById('map'), mapOptions); }) } google.maps.event.addDomListener(window, 'load', initialize);
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script> <div id="map" style="height:900px;width:1000px;"></div>