ease()-y as Math.PI: 1,200,000ms of Fun with D3’s Animated Transitions by Scott Murray.
From the webpage:
This is a presentation I gave at the Eyeo Festival in Minneapolis on June 11, 2014, adapted for the web. The talk was entirely live-coded in the JavaScript console, an experience I’ve tried to recreate here.
I recommend viewing this in Chrome, with the developer tools open. Click the next button to step through the presentation. Or, of course you can retype any of the code directly into the console yourself. Click any code block to execute it (but note that running them out of the intended order may produce unexpected results).
…
If you have any interest in D3 or in graphics you are going to enjoy this presentation!
Perhaps it will inspire you to try a live coding presentation. 😉
Or at least give you more confidence in using D3 for visualization.
PS: One moment of confusion as I was stepping through the presentation. I did not have the DOM inspector open, so I did not see the SVG element containing circles. The circles on my monitor resembled a solid line. My bad. The lesson here is to: Follow the Directions!