所以我必须在我的页面上添加一个“中心”按钮,当点击时,地图将使用setCenter方法在引脚上居中。但是,在我点击我的按钮后,地图变为空白而不是显示中心。
这是我的代码。
如何解决问题? 提前谢谢!
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script>
function init() {
var addButton = document.getElementById("setcenter");
addButton.onclick = handleSetCenterButtonClicked;
getMyLocation();
}
window.onload = init;
function getMyLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(displayLocation);
} else {
alert("Oops, no geolocation support");
}
}
function displayLocation(position) {
showMap(position.coords);
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
var div = document.getElementById("location");
div.innerHTML = "You are at Latitude: " + latitude + ", Longitude: " + longitude;
}
var map;
function showMap(coords) {
var googleLatAndLong = new google.maps.LatLng(coords.latitude, coords.longitude);
var mapOptions = {
zoom : 18,
center : googleLatAndLong,
mapTypeId : google.maps.MapTypeId.SATELLITE
};
var mapDiv = document.getElementById("map");
map = new google.maps.Map(mapDiv, mapOptions);
addMarker(googleLatAndLong);
}
var marker;
var markerArray = new Array();
function addMarker(latLong) {
var markerOptions = {
position : latLong,
map : map
};
marker = new google.maps.Marker(markerOptions);
markerArray.push(marker);
}
// this is my setCenter method function
function handleSetCenterButtonClicked(coords) {
var latLng = new google.maps.LatLng(coords.latitude, coords.lotitude);
map.setCenter(latLng);
}
// this is my setCenter method function
</script>
答案 0 :(得分:6)
问题在于你的功能(除了拼写错误):
function handleSetCenterButtonClicked(coords) {
var latLng = new google.maps.LatLng(coords.latitude, coords.lotitude);
map.setCenter(latLng);
}
点击coords
的类型为MouseEvent
,其中没有任何有关lat / lng的信息。它与google api的MouseEvent
不同。目前尚不清楚要设置哪个值为中心。打开页面的用户的位置?或者其他一些价值?
如果您希望在拖动中心后将中心定位到用户位置,则可以添加全局变量:
var yourPos;
在函数showMap()
中将其设置为已知值:
yourPos = googleLatAndLong;
并在点击处理程序中使用它:
function handleSetCenterButtonClicked(coords) {
//var latLng = new google.maps.LatLng(coords.lat(), coords.lng());
//map.setCenter(latLng);
map.setCenter(yourPos);
}
除此之外,如果用户不想分享他的位置,则不会处理案件。
答案 1 :(得分:1)
我认为代码错了:
var latLng = new google.maps.LatLng(coords.latitude, coords.lotitude);
应该是:
var latLng = new google.maps.LatLng(coords.latitude, coords.longitude);
在函数handleSetCenterButtonClicked(coords) - “coords.longitude”不是“coords.lotitude”