d3 Curve Function for Circular Corners

d3 Curve Function for Circular Corners

While fiddling with some transit map projects, I found myself experimenting with d3 as a way to programmatically draw curved lines for SVGs and websites. The library creates beautiful Bézier curves, but it did not have built-in support for the kind you would see in a transit diagram.

d3 makes use of modularized curve functions to plot curves in different ways, so I developed my own. This one takes a curve radius as a parameter, then connects an array of Cartesian coordinates with straight lines that curve just the right way near each vertex.