API Reference

Everything in D3 is scoped under the d3 namespace. D3 is broken up into several modules so that you can pick and choose which features you need and minimize the weight. The default build of d3.js includes the core, scale, svg and behavior modules, at about 16KB uglified and gzipped. You can edit the Makefile to produce a custom build that suits your needs. D3 does not introduce anything else in the global namespace, with the exception of two polyfills for nonstandard browsers: Date.now and Object.create.

D3 uses semantic versioning. You can find the current version of D3 as d3.version.

d3 (core)

Selections

d3.select - select an element from the current document.
d3.selectAll - select multiple elements from the current document.
selection.attr - get or set attribute values.
selection.classed - add or remove CSS classes.
selection.style - get or set style properties.
selection.property - get or set raw properties.
selection.text - get or set text content.
selection.html - get or set inner HTML content.
selection.append - create and append new elements.
selection.insert - create and insert new elements before existing elements.
selection.remove - remove elements from the document.
selection.data - get or set data for a group of elements, while computing a relational join.
selection.enter - returns placeholders for missing elements.
selection.exit - returns elements that are no longer needed.
selection.datum - get or set data for individual elements, without computing a join.
selection.filter - filter a selection based on data.
selection.sort - sort elements in the document based on data.
selection.order - reorders elements in the document to match the selection.
selection.on - add or remove event listeners for interaction.
selection.transition - start a transition on the selected elements.
selection.each - call a function for each selected element.
selection.call - call a function passing in the current selection.
selection.empty - returns true if the selection is empty.
selection.node - access the first node in a selection.
selection.select - subselect a descendant element for each selected element.
selection.selectAll - subselect multiple descendants for each selected element.
d3.selection - augment the selection prototype, or test instance types.
d3.event - access the current user event for interaction.

Transitions

d3.transition - start an animated transition.
transition.delay - specify per-element delay in milliseconds.
transition.duration - specify per-element duration in milliseconds.
transition.ease - specify transition easing function.
transition.attr - smoothly transition to the new attribute value.
transition.attrTween - smoothly transition between two attribute values.
transition.style - smoothly transition to the new style property value.
transition.styleTween - smoothly transition between two style property values.
transition.text - set the text content when the transition starts.
transition.tween - specify a custom tween operator to run as part of the transition.
transition.select - start a transition on a descendant element for each selected element.
transition.selectAll - start a transition on multiple descendants for each selected element.
transition.transition - start another transition on the same elements.
transition.remove - remove selected elements at the end of a transition.
transition.each - add a listener for transition end events.
transition.call - call a function passing in the current transition.
d3.ease - customize transition timing.
ease - a parametric easing function.
d3.timer - start a custom animation timer.
d3.timer.flush - immediately execute any zero-delay timers.
d3.interpolate - interpolate two values.
interpolate - a parametric interpolation function.
d3.interpolateNumber - interpolate two numbers.
d3.interpolateRound - interpolate two integers.
d3.interpolateString - interpolate two strings.
d3.interpolateRgb - interpolate two RGB colors.
d3.interpolateHsl - interpolate two HSL colors.
d3.interpolateArray - interpolate two arrays of values.
d3.interpolateObject - interpolate two arbitrary objects.
d3.interpolateTransform - interpolate two 2D matrix transforms.
d3.interpolators - register a custom interpolator.

Working with Arrays

d3.ascending - compare two values for sorting.
d3.descending - compare two values for sorting.
d3.min - find the minimum value in an array.
d3.max - find the maximum value in an array.
d3.extent - find the minimum and maximum value in an array.
d3.sum - compute the sum of an array of numbers.
d3.mean - compute the arithmetic mean of an array of numbers.
d3.median - compute the median of an array of numbers (the 0.5-quantile).
d3.quantile - compute a quantile for a sorted array of numbers.
d3.bisect - search for a value in a sorted array.
d3.bisectRight - search for a value in a sorted array.
d3.bisectLeft - search for a value in a sorted array.
d3.first - find the lowest element in an array.
d3.last - find the highest element in an array.
d3.permute - reorder an array of elements according to an array of indexes.
d3.zip - transpose a variable number of arrays.
d3.transpose - transpose an array of arrays.
d3.keys - list the keys of an associative array.
d3.values - list the values of an associated array.
d3.entries - list the key-value entries of an associative array.
d3.split - split an array into multiple arrays.
d3.merge - merge multiple arrays into one array.
d3.range - generate a range of numeric values.
d3.nest - group array elements hierarchically.
nest.key - add a level to the nest hierarchy.
nest.sortKeys - sort the current nest level by key.
nest.sortValues - sort the leaf nest level by value.
nest.rollup - specify a rollup function for leaf values.
nest.map - evaluate the nest operator, returning an associative array.
nest.entries - evaluate the nest operator, returning an array of key-values tuples.

Math

d3.random.normal - generate a random number with a normal distribution.
d3.transform - compute the standard form of a 2D matrix transform.

Loading External Resources

d3.xhr - request a resource using XMLHttpRequest.
d3.text - request a text file.
d3.json - request a JSON blob.
d3.html - request an HTML document fragment.
d3.xml - request an XML document fragment.

String Formatting

d3.format - format a number as a string.
d3.requote - quote a string for use in a regular expression.
d3.round - rounds a value to some digits after the decimal point.

CSV Formatting (d3.csv)

d3.csv - request a comma-separated values (CSV) file.
d3.csv.parse - parse a CSV string into objects using the header row.
d3.csv.parseRows - parse a CSV string into tuples, ignoring the header row.
d3.csv.format - format an array of tuples into a CSV string.

Colors

d3.rgb - specify a color in RGB space.
rgb.brighter - increase RGB channels by some exponential factor (gamma).
rgb.darker - decrease RGB channels by some exponential factor (gamma).
rgb.hsl - convert from RGB to HSL.
rgb.toString - convert an RGB color to a string.
d3.hsl - specify a color in HSL space.
hsl.brighter - increase lightness by some exponential factor (gamma).
hsl.darker - decrease lightness by some exponential factor (gamma).
hsl.rgb - convert from HSL to RGB.
hsl.toString - convert an HSL color to a string.

Namespaces

d3.ns.prefix - access or extend known XML namespaces.
d3.ns.qualify - qualify a prefixed name, such as "xlink:href".

Internals

d3.functor - create a function that returns a constant.
d3.rebind - rebind an inherited getter/setter method to a subclass.
d3.dispatch - create custom event dispatchers.
dispatch.on - register an event listener.
dispatch - dispatch an event to registered listeners.

d3.scale (Scales)

Quantitative

d3.scale.linear - construct a linear quantitative scale.
linear - get the range value corresponding to a given domain value.
linear.invert - get the domain value corresponding to a given range value.
linear.domain - get or set the scale's input domain.
linear.range - get or set the scale's output range.
linear.rangeRound - set the scale's output range, and enable rounding.
linear.interpolate - get or set the scale's output interpolator.
linear.clamp - enable or disable clamping of the output range.
linear.nice - extend the scale domain to nice round numbers.
linear.ticks - get representative values from the input domain.
linear.tickFormat - get a formatter for displaying tick values.
d3.scale.sqrt - construct a quantitative scale with a square root transform.
d3.scale.pow - construct a quantitative scale with an exponential transform.
pow - get the range value corresponding to a given domain value.
pow.invert - get the domain value corresponding to a given range value.
pow.domain - get or set the scale's input domain.
pow.range - get or set the scale's output range.
pow.rangeRound - set the scale's output range, and enable rounding.
pow.interpolate - get or set the scale's output interpolator.
pow.clamp - enable or disable clamping of the output range.
pow.nice - extend the scale domain to nice round numbers.
pow.ticks - get representative values from the input domain.
pow.tickFormat - get a formatter for displaying tick values.
pow.exponent - get or set the exponent power.
d3.scale.log - construct a quantitative scale with an logarithmic transform.
log - get the range value corresponding to a given domain value.
log.invert - get the domain value corresponding to a given range value.
log.domain - get or set the scale's input domain.
log.range - get or set the scale's output range.
log.rangeRound - set the scale's output range, and enable rounding.
log.interpolate - get or set the scale's output interpolator.
log.clamp - enable or disable clamping of the output range.
log.nice - extend the scale domain to nice powers of ten.
log.ticks - get representative values from the input domain.
log.tickFormat - get a formatter for displaying tick values.
d3.scale.quantize - construct a linear quantitative scale with a discrete output range.
quantize - get the range value corresponding to a given domain value.
quantize.domain - get or set the scale's input domain.
quantize.range - get or set the scale's output range (as discrete values).
d3.scale.quantile - construct a quantitative scale mapping to quantiles.
quantile - get the range value corresponding to a given domain value.
quantile.domain - get or set the scale's input domain (as discrete values).
quantile.range - get or set the scale's output range (as discrete values).
quantile.quantiles - get the scale's quantile bin thresholds.

Ordinal

d3.scale.ordinal - construct an ordinal scale.
ordinal - get the range value corresponding to a given domain value.
ordinal.domain - get or set the scale's input domain.
ordinal.range - get or set the scale's output range.
ordinal.rangePoints - divide a continuous output range for discrete points.
ordinal.rangeBands - divide a continuous output range for discrete bands.
ordinal.rangeRoundBands - divide a continuous output range for discrete bands.
ordinal.rangeBand - get the discrete range band width.
d3.scale.category10 - construct an ordinal scale with ten categorical colors.
d3.scale.category20 - construct an ordinal scale with twenty categorical colors.
d3.scale.category20b - construct an ordinal scale with twenty categorical colors.
d3.scale.category20c - construct an ordinal scale with twenty categorical colors.

d3.svg (SVG)

Shapes

d3.svg.line - create a new line generator.
line - generate a piecewise linear curve, as in a line chart.
line.x - get or set the x-coordinate accessor.
line.y - get or set the y-coordinate accessor.
line.interpolate - get or set the interpolation mode.
line.tension - get or set the cardinal spline tension.
d3.svg.line.radial - create a new radial line generator.
line - generate a piecewise linear curve, as in a polar line chart.
line.radius - get or set the radius accessor.
line.angle - get or set the angle accessor.
d3.svg.area - create a new area generator.
area - generate a piecewise linear area, as in an area chart.
area.x - get or set the x-coordinate accessors.
area.x0 - get or set the x0-coordinate (baseline) accessor.
area.x1 - get or set the x1-coordinate (topline) accessor.
area.y - get or set the y-coordinate accessors.
area.y0 - get or set the y0-coordinate (baseline) accessor.
area.y1 - get or set the y1-coordinate (topline) accessor.
area.interpolate - get or set the interpolation mode.
area.tension - get or set the cardinal spline tension.
d3.svg.area.radial - create a new area generator.
area - generate a piecewise linear area, as in a polar area chart.
area.radius - get or set the radius accessors.
area.innerRadius - get or set the inner radius (baseline) accessor.
area.outerRadius - get or set the outer radius (topline) accessor.
area.angle - get or set the angle accessors.
area.startAngle - get or set the angle (baseline) accessor.
area.endAngle - get or set the angle (topline) accessor.
d3.svg.arc - create a new arc generator.
arc - generate a solid arc, as in a pie or donut chart.
arc.innerRadius - get or set the inner radius accessor.
arc.outerRadius - get or set the outer radius accessor.
arc.startAngle - get or set the start angle accessor.
arc.endAngle - get or set the end angle accessor.
arc.centroid - compute the arc centroid.
d3.svg.symbol - create a new symbol generator.
symbol - generate categorical symbols, as in a scatterplot.
symbol.type - get or set the symbol type accessor.
symbol.size - get or set the symbol size (in square pixels) accessor.
d3.svg.chord - create a new chord generator.
chord - generate a quadratic Bézier connecting two arcs, as in a chord diagram.
chord.radius - get or set the arc radius accessor.
chord.startAngle - get or set the arc start angle accessor.
chord.endAngle - get or set the arc end angle accessor.
chord.source - get or set the source arc accessor.
chord.target - get or set the target arc accessor.
d3.svg.diagonal - create a new diagonal generator.
diagonal - generate a two-dimensional Bézier connector, as in a node-link diagram.
diagonal.source - get or set the source point accessor.
diagonal.target - get or set the target point accessor.
diagonal.projection - get or set an optional point transform.
d3.svg.diagonal.radial - create a new diagonal generator.
diagonal - generate a two-dimensional Bézier connector, as in a node-link diagram.

Axes

d3.svg.axis - create a new axis generator.
axis - creates or updates an axis for the given selection or transition.
axis.scale - get or set the axis scale.
axis.orient - get or set the axis orientation.
axis.ticks - control how ticks are generated for the axis.
axis.tickSubdivide - optionally subdivide ticks uniformly.
axis.tickSize - specify the size of major, minor and end ticks.
axis.tickPadding - specify padding between ticks and tick labels.
axis.tickFormat - override the tick formatting for labels.

Controls

Events

d3.svg.mouse - gets the mouse position relative to a specified container.
d3.svg.touches - gets the touch positions relative to a specified container.

d3.time (Time)

Time Formatting

d3.time.format - create a new local time formatter for a given specifier.
format - format a date into a string.
format.parse - parse a string into a date.
d3.time.format.utc - create a new UTC time formatter for a given specifier.
d3.time.format.iso - the ISO 8601 UTC time formatter.

Time Scales

d3.time.scale - construct a linear time scale.
scale - get the range value corresponding to a given domain value.
scale.invert - get the domain value corresponding to a given range value.
scale.domain - get or set the scale's input domain.
scale.range - get or set the scale's output range.
scale.rangeRound - set the scale's output range, and enable rounding.
scale.interpolate - get or set the scale's output interpolator.
scale.clamp - enable or disable clamping of the output range.
scale.ticks - get representative values from the input domain.
scale.tickFormat - get a formatter for displaying tick values.

Time Intervals

d3.time.day - round down to the nearest day (12:00 AM).
d3.time.days - get the days in the given range.
d3.time.hour - round down to the nearest hour (0th minute).
d3.time.hours - get the hours in the given range.
d3.time.minute - round down to the nearest minute (0th second).
d3.time.minutes - get the minutes in the given range.
d3.time.month - round down to the nearest month (1st date).
d3.time.months - get the months in the given range.
d3.time.second - round down to the nearest second (0th millisecond).
d3.time.seconds - get the seconds in the given range.
d3.time.week - round down to the nearest week (Sunday).
d3.time.weeks - get the weeks in the given range.
d3.time.year - round down to the nearest year (January 1).
d3.time.years - get the years in the given range.

d3.layout (Layouts)

Bundle

d3.layout.bundle - construct a new default bundle layout.
bundle - apply Holten's hierarchical bundling algorithm to edges.

Chord

d3.layout.chord - produce a chord diagram from a matrix of relationships.
chord.matrix - get or set the matrix data backing the layout.
chord.padding - get or set the angular padding between chord segments.
chord.sortGroups - get or set the comparator function for groups.
chord.sortSubgroups - get or set the comparator function for subgroups.
chord.sortChords - get or set the comparator function for chords (z-order).
chord.chords - retrieve the computed chord angles.
chord.groups - retrieve the computed group angles.

Cluster

d3.layout.cluster - cluster entities into a dendrogram.
cluster.sort - get or set the comparator function for sibling nodes.
cluster.children - get or set the accessor function for child nodes.
cluster.nodes - compute the cluster layout and return the array of nodes.
cluster.links - compute the parent-child links between tree nodes.
cluster.separation - get or set the spacing function between neighboring nodes.
cluster.size - get or set the layout size in x and y.

Force

d3.layout.force - position linked nodes using physical simulation.
force.on - listen to updates in the computed layout positions.
force.nodes - get or set the array of nodes to layout.
force.links - get or set the array of links between nodes.
force.size - get or set the layout size in x and y.
force.linkDistance - get or set the link distance.
force.linkStrength - get or set the link strength.
force.friction - get or set the friction coefficient.
force.charge - get or set the charge strength.
force.gravity - get or set the gravity strength.
force.theta - get or set the accuracy of the charge interaction.
force.start - start or restart the simulation when the nodes change.
force.resume - reheat the cooling parameter and restart simulation.
force.stop - immediately terminate the simulation.
force.drag - bind a behavior to nodes to allow interactive dragging.

Hierarchy

d3.layout.hierarchy - derive a custom hierarchical layout implementation.
hierarchy.sort - get or set the comparator function for sibling nodes.
hierarchy.children - get or set the accessor function for child nodes.
hierarchy.nodes - compute the layout and return the array of nodes.
hierarchy.links - compute the parent-child links between tree nodes.
hierarchy.value - get or set the value accessor function.
hierarchy.revalue - recompute the hierarchy values.

Histogram

d3.layout.histogram - construct a new default histogram layout.
histogram - compute the distribution of data using quantized bins.
histogram.value - get or set the value accessor function.
histogram.range - get or set the considered value range.
histogram.bins - specify how values are organized into bins.
histogram.frequency - compute the distribution as counts or probabilities.

Pack

d3.layout.pack - produce a hierarchical layout using recursive circle-packing.
pack.sort - control the order in which sibling nodes are traversed.
pack.children - get or set the children accessor function.
pack.nodes - compute the pack layout and return the array of nodes.
pack.links - compute the parent-child links between tree nodes.
pack.value - get or set the value accessor used to size circles.
pack.size - specify the layout size in x and y.

Partition

d3.layout.partition - recursively partition a node tree into a sunburst or icicle.
partition.sort - control the order in which sibling nodes are traversed.
partition.children - get or set the children accessor function.
partition.nodes - compute the partition layout and return the array of nodes.
partition.links - compute the parent-child links between tree nodes.
partition.value - get or set the value accessor used to size circles.
partition.size - specify the layout size in x and y.

Pie

d3.layout.pie - construct a new default pie layout.
pie - compute the start and end angles for arcs in a pie or donut chart.
pie.value - get or set the value accessor function.
pie.sort - control the clockwise order of pie slices.
pie.startAngle - get or set the overall start angle of the pie.
pie.endAngle - get or set the overall end angle of the pie.

Stack

d3.layout.stack - construct a new default stack layout.
stack - compute the baseline for each series in a stacked bar or area chart.
stack.values - get or set the values accessor function per series.
stack.order - control the order in which series are stacked.
stack.offset - specify the overall baseline algorithm.
stack.x - get or set the x-dimension accessor function.
stack.y - get or set the y-dimension accessor function.
stack.out - get or set the output function for storing the baseline.

Tree

d3.layout.tree - position a tree of nodes tidily.
tree.sort - control the order in which sibling nodes are traversed.
tree.children - get or set the children accessor function.
tree.nodes - compute the tree layout and return the array of nodes.
tree.links - compute the parent-child links between tree nodes.
tree.separation - get or set the spacing function between neighboring nodes.
tree.size - specify the layout size in x and y.

Treemap

d3.layout.treemap - use recursive spatial subdivision to display a tree of nodes.
treemap.sort - control the order in which sibling nodes are traversed.
treemap.children - get or set the children accessor function.
treemap.nodes - compute the treemap layout and return the array of nodes.
treemap.links - compute the parent-child links between tree nodes.
treemap.value - get or set the value accessor used to size treemap cells.
treemap.size - specify the layout size in x and y.
treemap.round - enable or disable rounding to exact pixels.
treemap.sticky - make the layout sticky for stable updates.

d3.geo (Geography)

Paths

d3.geo.path - create a new geographic path generator.
path - generate the path data string for a given geographic feature.
path.pointRadius - get or set the radius to display point features.
path.projection - get or set the geographic projection.
path.area - compute the projected area of a given feature.
path.centroid - compute the projected centroid of a given feature.
d3.geo.bounds - compute the latitude-longitude bounding box for a given feature.
d3.geo.greatArc - approximate the shortest path between two points.
greatArc - generate a GeoJSON LineStream.
greatArc.distance - computes the great circle distance, in radians.
greatArc.source - specify a source accessor.
greatArc.target - specify a target accessor.
greatArc.precision - specify the precision of the piecewise arc.
d3.geo.greatCircle - an alias for * d3.geo.circle.
d3.geo.circle - clip features to a circle with arbitrary radius and origin.
circle.origin - specify the origin in latitude and longitude.
circle.angle - specify the angular radius in degrees.
circle.precision - specify the precision of the piecewise circle.
circle.clip - clip the given GeoJSON object.

Projections

d3.geo.mercator - construct a new spherical Mercator projection.
mercator - project the specified position.
mercator.scale - get or set the projection's scale factor.
mercator.translate - get or set the projection's translate offset.
d3.geo.albers - construct a new Albers equal-area conic projection.
albers - project the specified position.
albers.origin - get or set the projection's origin.
albers.parallels - get or set the projection's two standard parallels.
albers.scale - get or set the projection's scale factor.
albers.translate - get or set the projection's translate offset.
d3.geo.albersUsa - construct a new composite Albers projection for the United States.
albersUsa - project the specified position.
albersUsa.scale - get or set the projection's scale factor.
albersUsa.translate - get or set the projection's translate offset.
d3.geo.azimuthal - construct a new Azimuthal (orthographic or stereographic) projection.
azimuthal - project the specified position.
azimuthal.mode - get or set the projection's mode (orthographic or stereographic).
azimuthal.origin - get or set the projection's origin.
azimuthal.scale - get or set the projection's scale factor.
azimuthal.translate - get or set the projection's translate offset.

d3.geom.hull

Contour

d3.geom.contour

API Reference

Math

Clone this wiki locally