您好我开发了一个地图来更新动态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:我认为可能与第三方合作
答案 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>