←back to thread

Monorail – Turn CSS animations into interactive SVG graphs

(muffinman.io)
85 points stanko | 1 comments | 08 Jul 25 21:33 UTC | HN request time: 0.651s | source
Show context
efskap ◴[12 Jul 25 00:35 UTC] No.44538236[source]▶
Cool stuff! Flattening things like colours into a 1D value is an interesting challenge here. How did you decide to weigh the R channel an order of magnitude higher than G and so on? I might've tried working with HSV for instance, since it feels like animations would often be along one of those axes, but maybe not.
replies(2): >>44538314 #>>44539478 #
didgeoridoo ◴[12 Jul 25 00:50 UTC] No.44538314[source]▶
Is that what’s happening with the color? I assumed it was doing (R+G+B)•Opacity, so the max would be 255•3=765 and the min would be 0.
replies(1): >>44538863 #
1. efskap ◴[12 Jul 25 02:42 UTC] No.44538863[source]▶
Yeah I dug up the relevant function because I was curious how one would solve this.

    return (r * 1000 + g * 100 + b * 10 + a * 255) / 10000;
https://github.com/Stanko/monorail/blob/2da287a4e822705a99d7...