在所有标记加载后停止弹跳标记

时间:2012-03-21 19:19:07

标签: jquery google-maps animation google-maps-markers

我有标记每秒加载一个。其中有50个,加载所有这些都需要一段时间。因此,作为他们仍在加载的指示,我已将其动画设置为反弹。但是一旦它们全部加载,我想停止弹跳动画。我该怎么办?

var geocoder;
var map;
var addresses = new Array();
var infowindow;
var theInterval;

function initialize() {
    geocoder = new google.maps.Geocoder();
    var latlng = new google.maps.LatLng(42.095287, -79.3185139);
    var myOptions = {
        maxZoom: 14,
        zoom: 9,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
    };
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    infowindow = new google.maps.InfoWindow({});
}

$(document).ready(function () {
    getAddresses();
    theInterval = setInterval("codeAddress()", 1000);
});

function getAddresses () {
    $('.LocationAddress').each(function () {
        addresses.push($(this).text());
    });
}

function codeAddress() {
    if (addresses.length == 0) {
        clearInterval(theInterval);
    }
    var addy = addresses.pop();
    geocoder.geocode({
        'address': addy
    }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            map.setCenter(results[0].geometry.location);
            var marker = new google.maps.Marker({
                position: results[0].geometry.location,
                map: map,
                title: addy,
            animation: google.maps.Animation.BOUNCE,

            });

            //Adding a click event to the marker 
            google.maps.event.addListener(marker, 'click', function () {
                infowindow.setContent('<div id=\"infowindow\" style=" height:100px;>' + '<div id=\"LeftInfo\">' + "Hello World!" + '</div>' + '</div>');
                infowindow.open(map, this);
            });
        }

    }); //Geocoder END
}

1 个答案:

答案 0 :(得分:0)

保留所有标记的列表。

当所有内容都加载后,循环播放并停止动画。

在其他新闻中,http://econym.org.uk/gmap/geomulti.htm值得一读。它的旧 - 并指的是h2 API的v2,否则信息仍然相关。

您还有一个错误的错误。应该在pop之后调用clearInterval。您当前的设置仍然会再次调用该函数 - 即使数组为空。