1

I want my features to smoothly transition different to colors based on its data.

For this I apply a new map.setPaintProperty but then the 'fill-color-transition' property becomes lost, forever.. Some code from a Maplibre jsfiddle

Mapboxgl seems to have same issue jsfiddle mapbox

layer paint property:

 paint: { 'fill-color-transition': { duration: 3700 }, 'fill-color': 'blue', 'fill-opacity': .6 } //it properly smoothly changes the colors map.setPaintProperty('polygons-layer','fill-color','orange') map.setPaintProperty( 'polygons-layer', 'fill-color', [ 'match', ['get', 'id'], 1, 'red', 'gray' ], 'rgba(236, 235, 235, 0.1)' // Default color for all other cases ); setTimeout(function() { //transition not working anymore map.setPaintProperty('polygons-layer', 'fill-color', 'orange') }, 2000)
Improve this question
6
  • Works without problems in Mapbox GL JS, so it seems like a bug in Maplibre GL JS. Commented Jan 29, 2024 at 19:27
  • Mentioned JSFiddle is still using Maplibre. Commented Jan 30, 2024 at 8:50
  • See working JSFiddle with Mapbox GL JS: jsfiddle.net/TomazicM/7e3akowc Commented Jan 30, 2024 at 9:21
  • sorry @TomazicM i just updated the mapbox jsfiddle jsfiddle.net/perikut/Lpgtx43v/11 and problem persists. Take into account that you are not applying a new symbolization before the transition as I do below (transitions stop working then) map.setPaintProperty( 'polygons-layer', 'fill-color', [ 'match', ['get', 'id'], 1, 'red', 'gray' ], 'rgba(236, 235, 235, 0.1)' // Default color for all other cases ); Commented Jan 30, 2024 at 9:51
  • Yes, you are right. After filter is used in the style, transition does not work any more. Seems like a bug. Commented Jan 30, 2024 at 15:07

0

Reset to default

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.