我正在尝试根据空间坐标数据在 Google map 上渲染邮政编码。由于坐标很多,我想仅动态加载可观察 map 上适用的坐标。
我正在尝试这样的事情:
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var ctaLayer = new google.maps.KmlLayer({
url: 'http://example.com/my.kml'
});
ctaLayer.setMap(map);
google.maps.event.addListener(map, 'bounds_changed', function() {
var ne_lat = map.getBounds().getNorthEast().lat();
var ne_lng = map.getBounds().getNorthEast().lng();
if(typeof ctaLayer !== 'undefined') {
ctaLayer.setMap(null);
}
var ctaLayer = new google.maps.KmlLayer({
url: 'http://example.com/my.kml?ne_lat=' + ne_lat + '&ne_lng=' + ne_lng;
});
ctaLayer.setMap(map);
});
问题是,当我尝试移动或缩放 map 时,它只会将我踢回到之前的位置(缩小或重新居中 map )。
最佳答案
KmlLayer 默认情况下自动以数据为中心。如果您不希望它更改缩放/中心,请将preserveViewport选项设置为true。
(加上您的代码中有语法错误)
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var ctaLayer = new google.maps.KmlLayer({
url: 'http://example.com/my.kml',
preserveViewport: true
});
ctaLayer.setMap(map);
google.maps.event.addListener(map, 'bounds_changed', function() {
var ne_lat = map.getBounds().getNorthEast().lat();
var ne_lng = map.getBounds().getNorthEast().lng();
if(typeof ctaLayer !== 'undefined') {
ctaLayer.setMap(null);
}
var ctaLayer = new google.maps.KmlLayer({
url: 'http://example.com/my.kml?ne_lat=' + ne_lat + '&ne_lng=' + ne_lng,,
preserveViewport: true
});
ctaLayer.setMap(map);
});
关于javascript - 动态更新/刷新 KmlLayer,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28290708/