d3-utils

Utility functions for D3 V4

Installation

npm install @vlad-florescu/d3-utils

Usage

initSvg(container, { width, height, margin })

Create a <svg> with given width and height inside container. Inside it, create a <g> with same dimensions minus given margin.

selection.each(function selFn(data) {
  const { g, chartWidth, chartHeight } = initSvg(d3.select(this), { width, height, margin });
}

selectionOr(fn, selection)

If selection is empty return the result of fn, otherwise return selection.

const arc = selectionOr(() => {
  return g.append('path').attr('class', 'arc');
}, g.select('path.arc'));

This is an alternative to the less functional:

let arc = g.select('path.arc'); 
if (arc.empty()) {
  arc = g.append('path').attr('class', 'arc');
}