尝试使用场所库创建一个围绕搜索位置的静态半径的圆圈。与此working example类似。唯一的区别是我只需要将圆半径设为静态。
这是我尝试过的(我是gmaps的新手):
var mapOptions = {
center: new google.maps.LatLng(37.7831,-122.4039),
zoom: 12,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var acOptions = {
types: ['establishment']
};
var autocomplete = new google.maps.places.Autocomplete(document.getElementById('autocomplete'),acOptions);
autocomplete.bindTo('bounds',map);
var infoWindow = new google.maps.InfoWindow();
var CircleOptions = {
strokeColor: '#FF0000',
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: '#FF0000',
fillOpacity: 0.35,
};
var cityCircle = new google.maps.Circle(CircleOptions);
google.maps.event.addListener(autocomplete, 'place_changed', function() {
infoWindow.close();
citycircle.close();
var place = autocomplete.getPlace();
if (place.geometry.viewport) {
map.fitBounds(place.geometry.viewport);
} else {
map.setCenter(place.geometry.location);
map.setZoom(17);
}
infoWindow.setContent('<div><strong>' + place.name + '</strong><br>');
infoWindow.setPosition(place.geometry.location);
infoWindow.open(map);
cityCircle.setPosition(infoWindow);
});
答案 0 :(得分:1)
以下代码不正确。 .setPosition方法需要google.maps.LatLng对象,而不是infoWindow。您应该从API中收到javascript错误或消息。
cityCircle.setPosition(infoWindow);
这应该有效(圆圈没有位置,它有一个中心):
cityCircle.setCenter(place.geometry.location);
您还需要定义圆的半径。