Reusable D3: Book, Demo, Slides. And A Little on MVC

Reusable D3 BookFinally, the D3 book is out, a book that focuses on how to write reusable D3 using a component and module based approach, and a book that also provides a very detailed thoroughly worked up example (as well as a large set of other examples).

Moving To a Model-View-Controller Model

One of the key impacts for me of the reusable code/design pattern at the heart of the book (and at the heart of D3), has not just been that my D3 code (and much of my JavaScript code) is now neater, easier to understand and maintain – but – that I now naturally want to structure my JavaScript code along model-view-controller lines.

Essentially, you create a component(s), component(s) that aren’t actually very bright, but which focus primarily on the “view”, or part of the “view”. The component(s) take data, render the data, and if decisions need to be made, the component(s) communicate data to the controller via the use of events (sent via d3.dispatch), and the controller makes decisions and tells the component what to do.

I’ve created an example (up at http://bl.ocks.org/cloudshapes/5909708) that demonstrates exactly this kind of approach. It’s also an example that demonstrates how to carry out relatively sophisticated co-ordination of transitions, and enter/update/exit code.


Spiral and Transitions

There’s a full, long write-up of this example, up on the Safari Books Online Blog.

Slides from the July London D3 Meetup


Talk RE Reusable D3

 

Last night (Tuesday July 23rd), I did a talk at a London D3 Meetup. Slides up at http://www.cloudshapes.co.uk/exp/london-d3-talk/. I think the talk went well, quite hard to get some of the ideas across in such a short period of time. The slides also contain some information regarding how to use D3 with backbone.js and angular.js, kindly supplied by co-authors of the book, Chris Viau, Andrew Thornton).

What Next?

We’re going to keep working on our data visualisation tool, and look to use many of the techniques outlined above in the projects we build for our clients. Anything that helps us write reusable, easy-to-maintain code can only help us provide a better service to the folks that we work with.