Joins features to path elements via: .selectAll("path") .data(states.features) .join("path") svg is an instance of a Scalable Vector Graphic. It's basically a mini language for making interactive graphics.

This code: .attr("stroke", "white") .attr("stroke-linejoin", "round") .attr("stroke-width", 1) is responsible for styling the borders. You can change the border color with the stroke pair and the width with the stroke-width pair.

These lines: .append("title") .text(d => " Percent Under 9th Grade Education: " + data.get(d.properties.NAME)); are enabling the tool tip when you hover over each state. You can change the message it displays as well as what attribute it displays.

This code is responsible for the layout and style of the legend: svg.append("g") .attr("transform", "translate(360,20)") .append(() => legend({ color: color, title: data.title, width: 260, tickFormat: ".1f" }) );

This line creates a function that maps a value to a color. We give it our different classes (Natural breaks) and the colors. Then later when we need to color in a polgyon, we can use this function by giving it a value and have it return the appropriate color.