Question

我正在为android创建一个phonegap应用程序。我对Javascript并不熟悉，并且遇到过我有两个函数的场景，一个用于初始化一个名为“map”的映射，另一个用于显示从地图上的数据库加载的标记列表。 / p>

但是我的问题是如何将标记设置为在不同功能中启动的地图上显示？

EDIT 这是一些代码：

function map() { ... map = new google.maps.Map(document.getElementById("map"), mapOptions); ... }

function markers() { var MarkerType1 = new google.maps.MarkerImage("/android_asset/www/assets/markerType1.png", new google.maps.Size(29.0, 48.0), new google.maps.Point(0, 0), new google.maps.Point(14.0, 24.0) );



var MarkerType2 = new google.maps.MarkerImage("/android_asset/www/assets/markerType2.png",
        new google.maps.Size(29.0, 48.0),
        new google.maps.Point(0, 0),
        new google.maps.Point(14.0, 24.0)
    );  

var geocoder = new google.maps.Geocoder();
    var eventList = $('ul#eventList').empty();

var eventPoints = $.ajax({
    type: 'GET',
    url: 'http://www.somedomain.com/loadEvents.php?&jsoncallback=?',
    dataType: 'JSONp',
    timeout: 5000,
    success: function(data) {
        $.each(data, function(i,item){
            if (item.EventType == 1) {                  
                    new google.maps.Marker({
                        position: new google.maps.LatLng(item.latitude, item.longitude),
                        map: this.map,
                        icon: MarkerType1,
                        draggable:false
                    });                      

            } else if (item.EventType == 2) {
                new google.maps.Marker({
                    position: new google.maps.LatLng(item.latitude, item.longitude),
                    map: this.map,
                    icon: MarkerType2,
                    draggable:false
                });
            }
        }
    }
});

Answer 1

这是一个变量范围的问题。确保在两个函数之外声明变量map。

例如。：

$(function() {
    var map;//outer variable is accessible within both functions.

    function createMap() {
        map = new google.maps.Map({
            ...
        });
    }

    function createMarkers() {
        $.ajax({
            ...
            success: function(data) {
                $.each(data, function() {
                    var marker = new google.maps.Marker({
                        map: map,
                        ...
                    });
                });
            }
        });
    }

    createMap();
    createMarkers();

});

实际上，如果需要调用地图/标记创建代码以响应未来的某些事件，您只需要将地图/标记创建代码放在函数中。

如果你想立即创建地图及其标记，当加载页面时，你可以按如下方式这样做：

$(function() {
    var map = new google.maps.Map({
        ...
    });

    $.ajax({
        ...
        success: function(data) {
            $.each(data, function() {
                var marker = new google.maps.Marker({
                    map: map,
                    ...
                });
            });
        }
    });
});

Answer 2

有两种方法可以解决这个问题。一种解决方案是上行范围链，直到标记范围和映射范围都是当前范围的后代，然后实例化变量，

   var map;
   var markers;

然后在这些函数中将生成的对象绑定到这些变量。这样两者都可以通过这些变量访问另一个。

另一种方法是使用观察者模式（several alternatives here）在准备好时发布地图和标记，并让任何一个订阅者（如您所见）适当地倾听对方的准备和捕获传递的对象。

区别在于方法1将地图和标记暴露给所有其他后代范围（可能不合适）。

Javascript - 在另一个函数中调用map

2 个答案: