Intro to D3
This is the source for Square's Intro to D3.js tutorial, it's a brief intro to d3.js with examples.
Developing Locally
Make sure you have Jekyll.
gem install jekyll
Generate the static HTML and serve it locally:
jekyll serve --watch
Contributing
See our CONTRIBUTING.md.
License
See our LICENSE.txt.
Upgrade to d3 v4
cc @RandomEtc @bhvaleri
This is a WIP -- most of it was easy, the
d3.layout.stack
→d3.stack
is a big change, I didn't get that working yet.I'll also need to do another pass to think about how to explain the
d3.selection.merge
immutable changes and do a read-through to make sure the copy all makes senseMaking click targets for nav items larger.
Although the highlight for a selected menu item is large, the click target for items in the nav menu is only a single list item. This patch makes moves the 12pt padding onto the link itself, making the nav require less precision to use.
Update tutorial for D3 v5
This tutorial should be compatible with v6 and v7 as well, since the only breaking changes I know of in those versions is in the file loading API.
The biggest change I made here is replacing examples & explanations of the old enter/merge/exit update pattern w/ the new selection.join API.
Other changes:
Update a section that was using deprecated code
A bit of example code on https://square.github.io/intro-to-d3/data-binding/ was still using the deprecated
rangeRoundBands
method. The whole section has been updated to use a band scale instead of an ordinal one.I am not sure the description is correct enough after being updated though.
I got some errors when I ran the code while following along your useful guide, so I figured this would be great for one of my first contributions to open source.
This would fix issue #22.
rangeRoundBands is deprecated in v4?
On https://square.github.io/intro-to-d3/data-binding/ there is a code section
It looks like
rangeRoundBands
was removed in v4?