Question

我已经构建了一个整页滑块（bxslider）网站，我异步加载不是着陆页幻灯片的“页面”。其中一张幻灯片，即联系人页面幻灯片，有三张google地图可以通过v3 api加载。这是代码（有一些按摩来处理bxslider潜在的克隆联系页面幻灯片以进行无限循环）：

var maploaded = false;
var artemis_marker = '/images/custom_marker.png';
var map;
var styles = [{ stylers: [{ saturation: -100}]}];

function loadScript(src) {
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = src;
    document.body.appendChild(script);
}

function initializeMaps() {
    $('.map').each(function () {
        $(this).addClass($(this).attr('rel'));
        var latlng = $(this).attr('latlng').replace(/ /g, '').replace(/\(/g, '').replace(/\)/g, '');
        var latlngarray = latlng.split(',');
        processmaps(parseFloat(latlngarray[0]), parseFloat(latlngarray[1]), $(this).attr('rel'));
    });
}

function initialize(obj, lat, lng) {
    var location = new google.maps.LatLng(lat, lng);
    var mapOptions = {
        zoom: 15,
        center: location
    };
    map = new google.maps.Map(obj, mapOptions);
    map.setOptions({ styles: styles });
    var marker = new google.maps.Marker({
        position: location,
        map: map,
        icon: artemis_marker
    });
}

function processmaps(lat, lng, mapclass) {
    var x = document.getElementsByClassName(mapclass);
    var i;
    for (i = 0; i < x.length; i++) {
        google.maps.event.addDomListener(window, 'load', initialize(x[i], lat, lng));
    }
}

function setContactMaps() {
    if (!maploaded) {
        maploaded = true;
        loadScript('http://maps.googleapis.com/maps/api/js?v=3&sensor=false&callback=initializeMaps');
    }
}

我已经完成了一些关于如何异步加载谷歌地图的阅读，并且我已经在这里实现了我的版本，但在我看来，在jquery的XMLHttpRequest（）的意义上它并不是那么多异步如果你将它设置为异步运行。相反，这种“延迟加载”似乎推动了加载谷歌地图引入“下游”的滞后，无论何处调用实际加载。

在我的情况下，当您单击联系人页面幻灯片上的某个联系人位置按钮时，它会触发加载api脚本然后加载地图。但是，我在点击时实例化的叠加层有一个空白点，而地图会慢慢加载到空间中（并且因为我在任何按钮点击上加载所有三个地图所以速度较慢，因为到目前为止我一直懒得将其分解为单个按钮点击的单独地图）。理想情况下，当你登陆联系页面幻灯片时，我会加载地图，但随后我在按钮上的jquery悬停效果会卡住并且在地图加载到幕后时不起作用。

这是因为处理悬停效果的jquery对象正忙于加载地图吗？有没有办法真正像XMLHttpRequest（）那样异步加载谷歌地图？任何其他解决方案，以消除此映射加载滞后？

试图了解异步v3谷歌地图的加载方式

0 个答案: