1

我有一个在整个应用程序中使用 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();
}
4

2 回答 2

0

有一个你在这里尝试做的例子......

看看他们的placeMarker函数以及他们如何初始化地图......

我的建议是从这个例子开始,并确保它有效。如果是这样,那么确定实施中的不同之处应该相对简单。

于 2012-12-06T21:02:59.310 回答
0

这看起来很糟糕:

return {
       label: item.formatted_address,
       value: item.formatted_address,
       latitude: item.geometry.location.lat(),
       longitude: item.geometry.location.lng()
       }

地理编码器是异步的,不能从回调例程返回任何内容。您需要在回调中使用变量。

于 2012-12-04T19:12:16.123 回答