timwis / vizwit

An interactive data visualization tool
http://vizwit.io
GNU General Public License v2.0
100 stars 35 forks source link

Animate Bar and DateTime #221

Closed timwis closed 6 years ago

timwis commented 6 years ago

It may be possible to leverage vue's <transition> component functionality, but we may need something like TweenLight. Several folks have recommended Sarah Dresner's (spelling?) videos on animating charts in vue.

timwis commented 6 years ago

Holy cow, I literally animated them with one line of CSS! SVG is pretty awesome. Our animations are simple enough (changes in positioning and height attributes) that I didn't even need Vue's <transition> hook. The trade-off, though, is that I had to rework the templates a bit so that the same element would be used for the "active" (blue) dataset, but it's actually a bit more logical now, if a bit less readable :/