`fill-color-transition` has no effect when updating feature state
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 12.4k
- Forks
- 2.4k
- PR merge metrics
- No merged PRs in 30d
Description
Hi y'all. I have a `fill` layer where I want to change its features' fill color according to some `featureState` in them, but applying a transition in between. The paint properties of this layer are as follows:
```js
paint: {
'fill-color-transition': {
duration: 300,
delay: 50,
},
'fill-color': [
'to-color',
['feature-state', 'fill'],
"#687287",
]
},
```
My expectation would be that once I call `setFeatureState on one of that layer's features, the color will be gradually changed as specified in the `fill-color-transition` property. But so far it's just switching colors without transition.
Additionally, when trying to debug with `queryRenderedFeatures`, the transition property seems to have been set to `undefined`, which seems unusual.
```js
paint: {
fill-color: Ge {r: 0.00784313725490196, g: 0.2627450980392157, b: 0.45098039215686275, a: 1},
fill-color-transition: undefined
}
```
The docs don't seem super clear on whether transitions are compatible with feature state changes, as opposed to paint property changes (indeed, going that route seems to work as expected but I need to change individual feature states, not the whole layer). So I wanted to know if there's anything here I'm doing wrong.
Thank you!
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by reproducing the reported behavior with a fill layer using fill-color-transition, feature-state, setFeatureState, and queryRenderedFeatures. Trace how feature-state updates are handled for paint transitions, then verify whether the transition is applied to individual feature colors and that the reported transition value is exposed as expected.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, typescript
- Domain
- frontend, web-dev
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100