使用筛选器 Mapbox (setPaintProperty) 进行平滑过渡

Smooth transition with filter Mapbox (setPaintProperty)

提问人:Cladjidane 提问时间:11/1/2023 更新时间:11/1/2023 访问量:25

问:

我正在尝试了解 setPaintProperty、setLayoutProperty 甚至 setFilter 方法中的过滤器(表达式)是如何工作的,因为我注意到过渡的一些特殊行为。

在这些方法中使用过滤器时,似乎没有应用转换。下面是一个示例 (https://codepen.io/cladjidane/pen/MWzLPeE),显示只有不带筛选器的 saintPaintProperty 应用平滑过渡。但是,一旦添加过滤器,它就不再起作用了。

map.setPaintProperty("state-fills", "fill-opacity", 0); // Smooth transition
// ...
map.setPaintProperty("state-fills", "fill-opacity", ["case", ["==", ["get", "STATE_NAME"],  "Florida"], 1, 0]); // No smooth transition

我确实在某处读到“这在技术上是不可能的”,但我想更多地了解它,以及可能还有另一种处理具有柔和效果的图层出现/消失的方法(如果可能的话,是高性能的)。

JavaScript 表达式 mapbox-gl-js

评论

0赞 Malcolm 11/14/2023
您是否尝试过设置功能状态?
0赞 Cladjidane 11/15/2023
@Malcolm我想过,但我不知道为什么我放弃了这个想法,但如果你有一个例子,我会很感兴趣^^ 否则我用野蛮人的技术管理过,但它很脏。this._map.setPaintProperty(layer.id, 'fill-opacity-transition', {duration: 0, delay: 0}); this._map.setPaintProperty(layer.id, 'fill-opacity', 0); setTimeout(function(){ map.setPaintProperty(layer.id, 'fill-opacity-transition', {duration: 300, delay: 0}); map.setPaintProperty(layer.id, 'fill-opacity', 1); }, 300)

答: 暂无答案