我刚刚发言,我想在谷歌地图上突出显示该地址,并进行一些修改,例如circle sample
这是帮助获取lat,lng信息Function returning undefined in Geocoder
的资源 $location
保留位置地址
function getLatLng(callback){
var geocoder = new google.maps.Geocoder();
var latlng = new Array(2);
// get Lat, Lang
geocoder.geocode({'address': '<?php echo $location ?>', 'region': 'UK'}, function(results, status){
if (status == google.maps.GeocoderStatus.OK) {
latlng[0] = results[0].geometry.location.lat();
latlng[1] = results[0].geometry.location.lng();
callback(latlng); // call the callback function here
} else {
console.log( "Unable to find address: " + status );
}
});
}
var citymap = {};
var CityCircle;
citymap['<?php echo $location ?>'] = {
center: getLatLng(function(latlng){ return latlng; }),
population: 2842518
};
但我无法将lat,lng信息发送到地图,我收到错误
TypeError: c[tb] is not a function
我知道&#34; geocode()&#34;功能是异步,有没有其他选择,以便我只能通过地址实现 Circle Simple ?
我用以下方法解决了这个问题:
function getLatLng(location){
var geocoder = new google.maps.Geocoder();
var latlng = new Array(2);
// get Lat, Lang
geocoder.geocode({'address': location, 'region': 'UK'}, function(results, status){
if (status == google.maps.GeocoderStatus.OK) {
latlng[0] = results[0].geometry.location.lat();
latlng[1] = results[0].geometry.location.lng();
//callback(latlng); // call the callback function here
var citymap = {};
var CityCircle;
citymap['<?php echo $location ?>'] = {
center: new google.maps.LatLng(latlng[0], latlng[1]),
population: 2842518
};
// rest code here
function initialize(){ .... }
// initialized map function without onload
initialize();
} else {
console.log( "Unable to find address: " + status );
}
});
}
setTimeout(function(){ getLatLng('<?php echo $location ?>'); }, 1000);
希望这有助于某人
答案 0 :(得分:0)
这是我认为你在追求的一个例子
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="https://developers.google.com/maps/documentation/javascript/examples/default.css">
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script type='text/javascript'>//<![CDATA[
var cityCircle;
// Create an object containing LatLng, population.
function loadCities(map) {
var citymap = {};
citymap['chicago'] = {
location: 'chicago',
population: 2842518
};
citymap['london'] = {
location: 'london',
population: 4000000
};
getLatLng(citymap['chicago'], function(city) {
addCityToMap(city, map);
});
getLatLng(citymap['london'], function(city) {
addCityToMap(city, map);
});
}
function getLatLng(city, callback){
var geocoder = new google.maps.Geocoder();
var latlng = new Array(2);
// get Lat, Lang
geocoder.geocode({'address': city.location, 'region': 'UK'}, function(results, status){
if (status == google.maps.GeocoderStatus.OK) {
latlng[0] = results[0].geometry.location.lat();
latlng[1] = results[0].geometry.location.lng();
city.center = new google.maps.LatLng(latlng[0], latlng[1]);
callback(city); // call the callback function here
} else {
console.log( "Unable to find address: " + status );
}
});
}
function addCityToMap(city, map) {
// Construct the circle for each value in citymap. We scale population by 20.
var populationOptions = {
strokeColor: '#FF0000',
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: '#FF0000',
fillOpacity: 0.35,
map: map,
center: city.center,
radius: city.population / 20
};
cityCircle = new google.maps.Circle(populationOptions);
}
function initialize() {
var mapOptions = {
zoom: 4,
center: new google.maps.LatLng(37.09024, -30.712891),
mapTypeId: google.maps.MapTypeId.TERRAIN
};
var map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
loadCities(map);
}
google.maps.event.addDomListener(window, 'load', initialize);
//]]>
</script>
</head>
<body>
<div id="map-canvas"></div>
</body>
</html>