d3-area-label

A library for placing labels in areas.

Example: https://bl.ocks.org/curran/2793201c7025c416c471e30d30546c6b

Installing

If you use NPM, npm install d3-area-label. Otherwise, download the latest release.

API Reference

# areaLabel(area)

Computes the optimal position and size for a label. Also positions the label using SVG transform.

Example usage:

const labels = svg.selectAll('text').data(stacked)
labels
  .enter().append('text')
    .attr('class', 'area-label')
  .merge(labels)
    .text(d => d.key)
    .each(d3.areaLabel(area)) // <--------------------- Call the function like this.

For more details and context, see test/index.html.

Thanks

Many thanks to Lee Byron, Noah Veltman, Philippe Rivière, and Adam Pearce for ideas and input.