我的实时跟踪kml地图在刷新时会产生延迟

时间:2013-12-06 03:12:58

标签: javascript xml google-maps kml

您好我开发了一个地图来更新动态kml每10秒刷新一次,但功能在刷新时会产生延迟这是刷新地图的功能但是滞后

 var ctaLayer = new google.maps.KmlLayer({
                    'preserveViewport': true,
                    url: 'http://190.216.202.35/control/patiosvb.xml?o='+ Math.random()
                });

                ctaLayer.setMap(map);
                ctaLayer.set('preserveViewport', true);




                window.setInterval( function() {
                    reload();
                }, 10000);

                function reload() {
                    ctaLayer.setMap(null);
                    var mctaURL = 'http://190.216.202.35/control/patiosvb.xml?o='+ Math.random()
                    ctaLayer = new google.maps.KmlLayer(mctaURL, {

                    });
                    ctaLayer.setMap(map);
                    ctaLayer.set('preserveViewport', true);
                }


                ctaLayer.setMap(map);

地图托管在

190.216.202.35/control/patiosp.html

获取任何改进代码以消除滞后的帮助

pd:我认为可能与第三方合作

1 个答案:

答案 0 :(得分:0)

你有status_changed事件:“(这个偶数)在KML图层加载完成后被触发。此时可以安全地读取status属性以确定图层是否已成功加载

此时您必须删除旧kml图层添加最新图层。

考虑以下例子:

<!DOCTYPE html>    
<html>
    <head>    
        <title>Kml Layer</title>
       <style type="text/css">
            html,  body{height: 100%;margin: 0;padding: 0;}
            #map-container{ height: 100%; width: 100%; min-width:500px; min-height:300px; }
        </style>
        <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
        <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
        <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>    

    </head>
    <body>
        <div id="map-container"></div>
        <script type="text/javascript"  language="javascript">
            var map;
            $(document).ready(function () {
                var mapOptions = {
                    zoom: 12,
                    center: new google.maps.LatLng(3.4199865, -76.519775),
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                }
                map = new google.maps.Map($("#map-container")[0], mapOptions);

                var ctaLayer = new google.maps.KmlLayer({
                    'preserveViewport': true,
                    url: 'http://190.216.202.35/control/patiosvb.xml?o=' + Math.random()
                });

                ctaLayer.setMap(map);
                ctaLayer.set('preserveViewport', true);

                setInterval(function () {reload(); }, 10000);

                var ctaLayerTmp;

                function reload() {

                    var mctaURL = 'http://190.216.202.35/control/patiosvb.xml?o=' + Math.random()
                    ctaLayerTmp = new google.maps.KmlLayer({
                        url: mctaURL
                    });

                    google.maps.event.addListener(ctaLayerTmp, "status_changed", function() {
                        ctaLayer.setMap(null);
                        ctaLayerTmp.set('preserveViewport', true);
                        ctaLayer = ctaLayerTmp;                     
                    });
                    ctaLayerTmp.setMap(map);
                }
                ctaLayer.setMap(map);
            });

        </script>
    </body>
</html>
相关问题