DEV Community

Discussion on: Graphing with Web Components 5: Web GPU

Collapse
 
ksnyde profile image
Ken Snyder

Oh that's a disappointing end to the WebGPU chapter. I wasn't expecting it to be usable in browsers just yet (without flags that is) but OpenGL is clearly a dying animal. I'm new to all of this but found your articles useful. I do have one question though ... surely there's a way in WebGPU to animate lines/bars/etc when data changes, isn't there?

Collapse
 
ndesmic profile image
ndesmic • Edited

I haven't really written anything about animation so far. But yes animation is possible, but it's all manual for canvas/webGL/webGPU. You'd basically draw the graph each frame. So you might use something like requestAnimationFrame and draw each frame each time moving/scaling/rotating etc by a little bit. Say you want a bar to grow from 0 to it's final value. If you know how long you want the animation to last (eg 0.5seconds) you can use a lerp to find the ratio of the time that has elapsed and then multiply that with the final value to get the intermediate value for that frame. CSS is much easier since all that is built in.