我有一张与轮播互动的地图。当轮播移动时,地图会飞到与新轮播项目中的信息相关联的新区域。
对于每个轮播项目,我都设置了带有一组点的相应GeoJSON图层,并希望在地图移至新的轮播项目时打开/关闭图层。我编写了以下代码来做到这一点:
let carouselMapMove = (event) => {
if (!this.map) {
return;
}
let camera = this.map.cameraForBounds(this.recents[event.to].bounds, {
padding: (window.innerWidth <= 640) ? (window.innerWidth * 0.15) : (window.innerHeight * 0.15)
});
if (camera) {
camera.duration = 3000;
this.map.flyTo(camera);
}
this.recents.forEach(recent_item =>{
this.map.setLayoutProperty(recent_item.id, 'visibility', 'none');
});
this.map.setLayoutProperty(this.recents[event.to].id, 'visibility', 'visible');
};
this.recents
是另一个JSON文件,其中包含所有轮播项目及其id
(我认为该部分效果很好)。
以下是GeoJSON模板之一的副本:
{
"id": "1",
"type": "symbol",
"source": {
"type": "geojson",
"data": {
"type": "FeatureCollection",
"features": [
{"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [0,0]}},
{"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [0.1,-0.1]}}
]
}
},
"layout": {
"icon-image" : "pin",
"icon-size" : 0.05,
"icon-offset" : [0,-250],
"visibility":"visible"
}
}
我的问题是,每当执行此事件并平移地图时,这些功能就会消失约0.5秒,但随着地图缩小并从该区域平移而立即消失。
有人知道如何解决此问题吗?我猜这与缩放级别的更改和图层自动重新打开有关。
谢谢,我什至感谢朝着正确方向前进!