异步加载谷歌地图 V3 时将数据传递给回调

Pass data to callback when asynchronously loading google maps V3

本文关键字：回调 数据 加载 谷歌地图 V3 异步      更新时间：2023-09-26

我正在异步加载谷歌地图API，它允许您定义在API加载时要执行的回调。有什么方法可以将参数传递给回调吗？

编辑：

这是我正在使用的代码。我有一个名为 master 的全局对象，用于存储以下函数。

/**
 * Load the Google Maps API
 * https://developers.google.com/maps/documentation/javascript/tutorial#Loading_the_Maps_API
 */
loadGoogleMaps: function(){
    var googleMaps = document.createElement("script");
    googleMaps.type = "text/javascript";
    googleMaps.src = "http://maps.googleapis.com/maps/api/js?key=[MYAPIKEY]&sensor=false&callback=master.mapInit";
    document.body.appendChild(googleMaps);
}

我希望能够将位置数组传递到mapInit，以便在初始化地图时向地图添加标记。我还希望能够全局访问对地图的引用，以便在创建地图后修改地图。

/**
 * Initialize the map
 */
mapInit: function(){
    // Default map options
    var mapOptions = {
        zoom: 4,
        center: new google.maps.LatLng( 40, -95 ),
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    // Create map
    var map = new google.maps.Map( document.getElementById("map"), mapOptions );
}

我最终解决了将参数传递给回调的需求。

我在master对象中创建了一个对象来保存有关特定地图的信息。每个映射都定义了自己的回调。它还保存对初始化映射的引用以及回调需要引用的任何其他特定于映射的数据。

/**
 * Map listing
 */
mapList: {
    mainMap: {
        map: "",
        callback: function(){
            for( var i = 0, length = this.locations.length; i < length; i++ ){
                master.placeMapMarker( this.locations[i], this );
            }
        },
        prevInfoWindow: "",
        locations: {}
    }
}

我修改了 mapInit 函数以存储对映射的引用并在 master.mapList.mainMap 中执行回调。

/**
 * Initialize the map
 */
mapInit: function(){

    // Default map options
    var mapOptions = {
        zoom: 4,
        center: new google.maps.LatLng( 40, -95 ),
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    // Create map
    var mapName = $("#map").data("name");
    var map = this.mapList[mapName].map = new google.maps.Map( document.getElementById("map"), mapOptions );
    this.mapList[mapName].callback();

}

我将地图名称存储在地图占位符元素上的 data-name 属性中。

<div id="map" data-name="mainMap"></div>

如何将您的函数包装到一些虚拟函数中，该函数传递必要的参数，例如：

function wrapper()
{
    myCallback(arg1, arg2);
}

并将wrapper()作为谷歌地图回调传递

相关文章：