Graph representations of YUI Easing Methods

First, for those who didn’t get the news already, I’m now working at Yahoo! as a Front-end Engineer on the Yahoo! Mail team. As a result, I’m presently down in Sunnyvale, California for a week of orientation and training. In a quirk of perfect timing, my visit coincides with the first ever YUICONF, the first day of which just ended.

The last event of the day was a “show and tell” where people showed what they’d built using YUI. Philip Tellis showed off his YUI port of the Flot graphing library which got me thinking of a little utility I’d written a while back. When I was writing the animation chapter of the YUI section of Professional JavaScript Frameworks, I needed a way to accurately display what the animation easing methods looked like. So I wrote a little utility that basically drew a chart and passed some linear data through a selected YUI easing method, then plotted the points. Voila! Instant accurate representation!★