D3.js Resources to Level Up
Last published on May 01, 2015 by Marcos Iglesias
This article was originally posted on the Eventbrite Engineering Blog.
I have improved my D3.js experience dramatically over the past two years.I have lived several drastical improvements on my way of creating D3.js charts during the last 2 years. Usually when I have increased my skill level in D3 itthey coincided with reading someany of the books I introduce in this post. The examples, tutorials and blog posts below should be helpful for wherever you are you on own your D3 journey., but I think they could also be reached through different ways, including the following examples, tutorials and blog posts.
Assessing your own level
Firstly I willI would like to define four Dd3.js levels of experience in a broad sense:
- Complete Beginner: You don't hold any previous experience with D3.js or any front- end technologiesy like HTML or CSS.
- Basic: You have some HTML/CSS/JavaScript skills and havehaving playeding with some D3.js examples, but you don’tnot completely understanding allsome of the patterns and mechanics that it uses.
- Intermediate: You already know how to customize D3.js graphs given existing examples you find in the wildsearch engines, but you struggle to reuse them and you aren’t quite happy with the quality of the code itself.
- Proficient: You’ have already built a lot of different D3.js graphs, tested and integrated them with different technologies or libraries and you even created packages to easily share logic between projects.
Complete Beginner
Books
Scott Murray’s Interactive Data Visualization for the Web. You can read it for free online O'Reilly and it covers much of the basics needed for building your first interactive graphs.
Tutorials and hHand’s- on ‘Learning
- Scott Murray’s D3 Tutorials. The seed material of his O’Reilly book.
- The DashingD3js.com free tutorial is a very complete guideand,.
- Tto play around and experiment,, the Codecademy D3 tutorial is a good place to start.should work fine.
Reference links
Check what you can do with Christophe Viau’s D3.js Gallery, it is a pretty extensive list of charts made on D3 and sorted by graph type (bars, pie, bubbles and so on).
Courses
Udacity's Data Visualization with D3.js, Communication with Data . I haven't followed it, but it'is free and looks sweet!
Basic
Books
Getting started with D3.js: a short introduction (around 70 pages.) targeted atfor web developers.
Tutorials and hands-onHand’s on lLearning
Introductions & Core Concepts sections of the D3 wiki tutorials.
Reference links
- Learn more about SVG, the basic building blocks of D3 graphs.
- Understand some of the essential D3 patterns:
Intermediatery
Books
- Developing a D3.js Edge is, a short and right- to- the- point book. Check out my book review.
- Mastering D3.js by Pablo Navarro, a full fledged reference book for D3 charts creation. I also reviewed this book tooit.
Tutorials and hands-onHand’s on lLearning
Introductions & Core Concepts section of the D3 wiki tutorials
Reference links
- Check out examples based on your doubts on specific API and method questions withs on Mike Bostock’s Blockexplorer.
- Review the seminal post on the Reusable API technique: Towards reusable charts by Mike Bostock.
- Make use of the number and time formatting example blocks.
- Keep up to date with all the great stuff in the Dashingd3 newsletter.
Videos
There is a nice selection in Ian Johnson’s bayd3 youtube playlist.
Proficient
Books
Maybe some of the stuff in Mastering D3.js is new for you, but at your level probably there are not too many advanced D3.js books isn't too much published out there for you.
Tutorials and hands-onHand’s on lLearning
Check out the Specific Techniques section of the D3 wiki tutorials
Reference links
- Your best friends will be the official D3 API Reference.,
- Tthe D3 Google Group. and
- D3 on Stack Overflow.
- Keep up to date with the #dataviz hashtag oin twitter.
- Take a look and sSpot some useful patterns in the D3 Plugins repository.
Blogs
I hope this set of links will My goal for this post was to helpmake it easier to you level up your Dd3.js skilldevelopers to advance to the next level, or at least, provide some help with it. The resources here listed are not the only ones out there, I hope you can use these to lean and build more exciting things!but are the ones I am more familiar with.
I hope this set of links will help a bit and don't hesitate to comment if you think we should include your favorite D3 learning source!