我有一个在整个应用程序中使用 Google 地图的 MVC 应用程序。为简单起见,我创建了一个 JavaScript 文件来初始化地图并设置地图显示。
在我的应用程序中,我想让前端开发人员通过一个简单的 JavaScript 调用来更改地图位置的中心。不幸的是,在声明地图并加载应用程序之后,如果您尝试对地图变量进行 JavaScript 回调,则地图 JS 变量(以及所有变量)为空。这会将实例放到地图上,并且不允许我更改位置(我相信)。
在下面的 JS 代码中,我试图从 HTML 页面调用 setLocation 来重置位置。这是代码的失败部分。帮助表示赞赏。
var map;
var geocoder;
var marker;
$(document).ready(function () {
initialize();
$(function () {
$("#address").autocomplete({
//This bit uses the geocoder to fetch address values
source: function (request, response) {
geocoder.geocode({ 'address': request.term }, function (results, status) {
response($.map(results, function (item) {
return {
label: item.formatted_address,
value: item.formatted_address,
latitude: item.geometry.location.lat(),
longitude: item.geometry.location.lng()
}
}));
})
},
select: function (event, ui) {
$("#Place_Latitude").val(ui.item.latitude);
$("#Place_Longitude").val(ui.item.longitude);
var location = new google.maps.LatLng(ui.item.latitude, ui.item.longitude);
marker.setPosition(location);
map.setCenter(location);
}
});
});
});
function setLocation(lat, lon) {
var location = new google.maps.LatLng(lat, lon);
marker.setPosition(location);
map.setCenter(location);
}
function initialize() {
var location = new google.maps.LatLng(-34.397, 150.644);
var mapOptions = {
center: location, zoom: 8, mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
marker = new google.maps.Marker({
map: map,
draggable: true
});
marker.setPosition(location);
geocoder = new google.maps.Geocoder();
}