Override default layer styles to allow animations inside shader
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 12.4k
- Forks
- 2.4k
- PR merge metrics
- No merged PRs in 30d
Description
## Motivation
I want to be able to create a spinner-like circle and an animated arrow like line using shader (for performance reasons).
I did that with mapbox gl js versions before 0.40 with a shader hack (I just replaced the circle fragment shader and sending performance.now() as a new u_time variable in the shader). However, I would like to know if it would be possible to do this correctly with the new versions.
### Implementation
We just need to send performance.now() or RequestAnimationFrame value to all the default style layers. Then there should be a simple way to simply provide a custom fragment.glsl file to override the default ones.
I know we could do the same with the new custom layers, but that would be overkill to create a renderer from scratch just to animate a circle or a line.
[See this gist for a working fragment shader](https://gist.github.com/kaligrafy/d2fa2155a70940f08170b13436bd5515)
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 reviewing the existing custom-layer approach and the working fragment shader linked in the issue. Define how default style layers would receive animation timing and how users would provide replacement fragment shaders; done means both capabilities work without requiring a renderer from scratch.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- computer-graphics
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100