This is a Leanpub book. Leanpub empowers authors and publishers with the Lean Publishing process. Lean Publishing is the act of publishing an in-progress ebook using lightweight tools and many iterations to get reader feedback, pivot until you have the right book and build traction once you do.
Acknowledgements
Mike
First and foremost I would like to express my thanks to Mike Bostock, the driving force behind d3.js. His efforts are tireless and his altruism in making his work open and available to the masses is inspiring.
The decision for him to leave what must have been an incredible job with the New York Times to return to improving visualisation software (d3.js in particular) has marked him as a very special person indeed. If any reader of this book has the opportunity to support his continuing efforts, please do.
Partners, Supporters and Contributors.
Mike has worked with a crew of like-minded individuals in bringing D3 to the World. Vadim Ogievetsky and Jeffrey Heer share honours for the work on D3: Data-Driven Documents and while there has been a cast of over 40 people contributing to the D3 code base, Jason Davies stands out as the man who has provided a generous portion especially in the area of mapping.
Nick Zhu has created a fantastic resource in dc.js (which is built on top of d3.js and crossfilter) and has been kind enough to provide good advice and permission to include some of his work.
Advice given by Christophe Viau has been a great help in getting me settled into the on-line world and his energy in managing and directing the D3 community is amazing.
Mike Dewar (Getting Started with D3), Scott Murray (Interactive Data Visualization for the Web) and Sebastian Gutierrez (dashingd3js.com) lead the pack for providing high quality reference material for learning D3. Many thanks gentlemen.
Proof Reading
I am particularly grateful for the assistance given by Filiep Spyckerelle and Robin Bennett who selflessly donated their time and expertise in proofreading the earlier edition of D3 Tips and Tricks (d3.js v3) (where this document contains any errors, they are most certainly mine).
In fact Robin has been very quick off the mark and is feeding back areas for improvement in the new book already!
The d3.js Community
Big thanks go out to the D3 community. Whether providing advice on Google Groups or Stack Overflow, contributing examples on bl.ocks.org or just giving back in the form of time and effort to similar work. Well done all.
Cover art
Out of the blue and in yet another example of the friendly and giving nature of people involved in this community I was contacted by Jose (Tactician Jenro) who offered to use his skills to design a cover for the original book. He has subsequently designed the cover for this version and I think he did an awesome job and was super helpful. If you think that he could help you out with a project, you can get in touch with him at @tacticianjenro or via his web site at http://mindthetimes.xyz/.
A sampling of works by Tactician Jenro
Leanpub
Lastly, I want to pay homage to Leanpub who have made the publishing of this document possible. They offer an outstanding service for self-publishing and have made the task of providing and distributing content achievable.
Make sure you get the most up to date copy of D3 Tips and Tricks
If youve received a copy of this book from any location other than Leanpub then its possible that you havent got the latest version. Go to https://leanpub.com/d3-t-and-t-v4 and download the most recent version. After all, it wont cost you anything :-). If you find some value in the work, please consider contributing when you download it so that Leanpub get something for hosting the book (and Ill think of you fondly while I continue adding content :-D).
What is d3.js?
d3.js (hereafter abridged as D3) is a JavaScript library for manipulating documents based on data.
But that description doesnt do it justice.
D3 is all about helping you to take information and make it more accessible to others via a web browser.
Its a JavaScript library. That means that its a software tool that can be used in conjunction with other software tools to achieve a task. Those other tools are based on web standards such as HTML, SVG and CSS but you dont need to know too much about them to start using D3 (although it will help :-)).
Its an open framework, which means that there are no hidden mysteries about how it does its magic and it allows others to contribute to a constant cycle of improvement.
Being built to leverage web standards means that modern browsers dont have to do anything special to use D3, they just have to support the framework that the Internet has adopted for ease of use.
The beauty of D3 is that it allows you to associate data and what appears on the screen in a way that directly links the two. Change the data and you change the object on the screen. D3s trick is to let you set what appears on the screen. A circle, a line, a point on a map, a graph, a bouncing ball, a gradient (and way, way more). Once the data and the object are linked the possibilities are endless.
D3 bridges the gap between the static display of data and the desire of people to represent it dynamically. That applies equally to the developer who wants to show something cool and to the end user who wants to be able to explore information interactively.
It was (and still is being) developed by Mike Bostock who has not just spent time writing the code, but writing the documentation for D3 as well. There is an extensive community of supporters who also contribute to the code, provide technical support online and generally have fun creating amazing visualizations. Their contributions are extraordinary (you only have to look at the work of Jason Davies to be amazed).
This book has been written to incorporate the changes in version 4 of d3.js to the original edition of D3 Tips and Tricks. If youre looking for the equivalent for version 3 you can find it here.
Introduction
I never set out to write treatise on D3 But here I am three years after publishing the first version of this book and Im in the process of updating it for version 4 of d3.js, while also looking back at a range of other books that have been written as a result of this first foray into publishing.
I am a simple user of this extraordinary framework and when I say simple, I really mean I had no idea how to get it to do anything when I started; I needed to do a lot of searching and learned by trial-and-error (emphasis on the errors which were entirely mine). The one thing that I did know was that the example graphics shown by Mike Bostock and others were the sort of graphical goodness that I wanted to play with.
So to get from the point of having no skills whatsoever to the point where I could begin to code up something to display data in a way I wanted, I had to capture the information as I went. The really cool thing about this sort of process is that it doesnt need to occur all at once. You can start with no knowledge whatsoever (or pretty close) and by standing on the shoulders of others work, you can add building blocks to improve what youre seeing and then change the blocks to adapt and improve.