Support D3 v4

D3 is being broken up into smaller modules for v4 (e.g. d3-scale, d3-selection, etc) and there are some API changes.

Discuss version support & approach. Should dc.js support d3 v3 and v4 or only one of them? One option to support both is a jQuery-style approach where 2.x supports v3 and 3.x supports v4.

[mtraynham]

I’ve put together this table which should help identify all uses of d3 in dc.js and references to the d3 4.0 counterpart.
Note: This table does not currently outline any inconsistencies and breaking changes, but I will add them if they are identified.

D3 V3 Reference	D3 V4 Package	D3 V4 Global Reference	D3 V4 ES6 Import
d3.functor	NA	NA	NA
d3.dispatch	d3-dispatch	d3.dispatch	import dispatch from ‘d3-dispatch/src/dispatch’
d3.select	d3-selection	d3.select	import select from ‘d3-selection/src/select’
d3.mouse	d3-selection	d3.mouse	import mouse from ‘d3-selection/src/mouse’
d3.event	d3-selection	d3.event	import event from ‘d3-selection/src/selection/on’
d3.scale.ordinal	d3-scale	d3.scaleOrdinal	import scaleOrdinal from ‘d3-scale/src/ordinal’
d3.scale.linear	d3-scale	d3.scaleLinear	import scaleLinear from ‘d3-scale/src/linear’
d3.scale.quantize	d3-scale	d3.scaleQuantize	import scaleQuantize from ‘d3-scale/src/quantize’
d3.scale.category20c	d3-scale	d3.schemeCategory20c	import category20c from ‘d3-scale/src/category20c’
d3.interpolate	d3-interpolate	d3.interpolate	import interpolate from ‘d3-interpolate/src/value’
d3.interpolateHcl	d3-interpolate	d3.interpolateHcl	import interpolateHcl from ‘d3-interpolate/src/hcl’
d3.interpolateNumber	d3-interpolate	d3.interpolateNumber	import interpolateNumber from ‘d3-interpolate/src/number’
d3.quantile	d3-array	d3.quantile	import quantile from ‘d3-array/src/quantile’
d3.min	d3-array	d3.min	import min from ‘d3-array/src/min’
d3.max	d3-array	d3.max	import max from ‘d3-array/src/max’
d3.sum	d3-array	d3.sum	import sum from ‘d3-array/src/sum’
d3.range	d3-array	d3.range	import range from ‘d3-array/src/range’
d3.extent	d3-array	d3.extent	import extent from ‘d3-array/src/extent’
d3.ascending	d3-array	d3.ascending	import ascending from ‘d3-array/src/ascending’
d3.descending	d3-array	d3.descending	import descending from ‘d3-array/src/descending’
d3.timer	d3-timer	d3.timer	import {timer} from ‘d3-timer/src/timer’
d3.set	d3-collection	d3.set	import set from ‘d3-collection/src/set’
d3.nest	d3-collection	d3.nest	import nest from ‘d3-collection/src/nest’
d3.svg.arc	d3-shape	d3.arc	import arc from ‘d3-shape/src/arc’
d3.svg.area	d3-shape	d3.area	import line from ‘d3-shape/src/area’
d3.svg.line	d3-shape	d3.line	import line from ‘d3-shape/src/line’
d3.svg.symbol	d3-shape	d3.symbol	import symbol from ‘d3-shape/src/symbol’
d3.layout.pie	d3-shape	d3.pie	import pie from ‘d3-shape/src/pie’
d3.layout.stack	d3-shape	d3.stack	import stack from ‘d3-shape/src/stack’
d3.svg.axis	d3-axis	d3.axisTop	import {axisBottom, axisLeft} from ‘d3-axis/src/axis’
d3.svg.brush	d3-brush	d3.brush	import {brushX, brushY, default as brush} from ‘d3-brush/src/brush’
d3.format	d3-format	d3.format	import {format, utcFormat} from ‘d3-format/src/defaultLocale’
d3.time.format	d3-time-format	d3.timeFormat	import {timeFormat, utcFormat} from ‘d3-time-format/src/defaultLocale’
d3.geo.path	d3-geo	d3.geoPath	import path from ‘d3-geo/src/path/index’
d3.behavior.zoom	d3-zoom	d3.zoom	import zoom from ‘d3-zoom/src/zoom’

[gordonwoodhull]

Cool! I will check it out.

BTW, thanks to @mtraynham, we now have HTML documentation which you may find more navigable. We should advertise it better!

Suggestions welcome.