MapboxGL JS 動畫過渡 GeoJSON 特征不透明度

Question

我有一個 GeoJSON 層，其中包含作為源添加到我的 Mapbox map 的房地產地塊。 當用戶點擊特定地塊時，我的創意團隊希望該地塊產生脈沖或使其不透明度從 1 到 7 不斷重復，直到我們移除活動的 state。 我在所選批次中添加了一個活動功能 state 並且着色一切正常，但是我不確定在該功能處於活動狀態時是否可以實現連續淡入/淡出。 這在 MapboxGL JS 中可行嗎？

我附上了很多彩色的圖片。

我們也曾經在這個項目中使用谷歌地圖並且能夠達到預期的效果，所以我創建了一個 GIF 來清楚我們正在尋找什么。

有人知道嗎？

提前致謝。

Answer 1

fill-color是一個可轉換的屬性，因此當您更改不透明度時，它會在短時間內進行視覺轉換 - 默認情況下為 300 毫秒。

為了實現你想要的：

• 使用 window.setInterval() 創建一個定時器循環
• 在里面，使用map.setPaintProperty('mylayer', 'fill-opacity', ...)設置圖層的不透明度
• 或者，使用樣式定義中圖層上的transition屬性來控制過渡持續時間。