by admin | Mar 30, 2014 | Productive Boredom
If you are expecting an amazing resource that will shed light on all things chart-related, you clearly don’t know me. If you want to be mildly entertained while getting a glimpse of the charting possibilities of D3.js, you’re in the right place. If you want to see the final result without reading the rest of this post, I’ll forgive you. Having used D3 for a couple other projects, I knew it could do cool things. This time I wanted to try a bunch of different charts for a broader view of D3. As a bonus, I thought I’d try some animated transitions, because what’s better than a plain old chart? A chart that moves, of course! The Setup I used the awesome fullPage.js to set up the project, with one chart per page. The documentation for fullPage.js is great and it’s incredibly easy to get something up and running. There were even examples of the type of side navigation I wanted (I’m a sucker for examples). Since I didn’t have any actual data to plot, I was able to get a bit creative and finesse the data to get the look I wanted. So much power, so little time. It Moves! For charts in the wild, animation should be used sparingly. For my little Frankenstein charts, though, anything goes (mwah ha ha ha). I used animations and transitions left and right just to see what I could conjure up. After all, the best way to learn about D3 transitions is to try them, right? Bar Chart The bar chart didn’t take much work because I had made them before....
Recent Comments