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 sense

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.

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 the README to be more explicit about which version this tutorial supports
• add link to D3 graph gallery in "further reading" section
• use fat arrow syntax for functions in code examples, for conciseness

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.

On https://square.github.io/intro-to-d3/data-binding/ there is a code section

var y = d3.scaleOrdinal()
  .rangeRoundBands([0, 75])
  .domain(sales.map(function(d, i) {
    return d.product;
  }));

It looks like rangeRoundBands was removed in v4?