JavaScript Visual Chart Library D3.js API Chinese Reference

Author：Eve Cole Update Time：2025-05-16 15:16:01

All APIs provided by the D3 library are in the d3 namespace. The d3 library uses semantic versioning. You can use d3.version to view the current version information.

d3 (core part)

Selection Set

d3.select - Select a series of elements from the current document.
d3.selectAll - Select multiple elements from the current document.
selection.attr - Set or get the specified attribute.
selection.classed - Add or delete the CSS class (CSS class) of the selected element.
selection.style - Set or delete the CSS property. style priority is higher than attr.
selection.property - Set or get the native property value (raw property).
selection.text - Sets or gets the label text content of the selected element.
selection.html - Set or get HTML content for selected elements (similar to innerHTML)
selection.append - After creating and adding a new element to the selected element.
selection.insert - Create and add a new element before the selected element.
selection.remove - Removes the selected element from the current document object.
selection.data - get or set data for a group of elements, while computing a relational join.
selection.enter - Returns the placeholder of the missing element, pointing to a portion of the bound data that is more than the selected element set.
selection.exit - Returns the element set of redundant elements, i.e., selects more than the bound data in the element. (Example 1, Example 2, Example 3 about the data, enter, exit principle)
selection.datum - Set or get data of individual elements, not associated. (get or set data for individual elements, without computing a join.)
selection.filter - Filters the selection set based on the bound data.
selection.sort - Sort the selected elements according to the bound data.
selection.order - Reorder elements in the document to match the selection set.
selection.on - Add or delete event listeners.
selection.transition - Starts a transition effect (returns to the Transition object), which can be understood as an animation.
selection.interrupt - Stops all animation actions immediately.
selection.each - Calls the specified function for each selected element set.
selection.call - Calls the specified function for the currently selected element set.
selection.empty - Test whether the selection set is empty.
selection.node - Returns the first element in the selection set.
selection.size - Returns the number of elements in the selection set.
selection.select - Select the first child element in the selected element to form a new selection set.
selection.selectAll - Select multiple child elements in the selected element to form a new selection set.
d3.selection - Selection set object prototype (can be enhanced for selection sets through d3.selection.prototype ).
d3.event - Get the user event of the current interaction.
d3.mouse - Gets the coordinates of the mouse relative to a certain element.
d3.touches - Get the coordinates of touch points relative to a certain element.

Transition effect

d3.transition - Start an animation transition. Simple tutorial
transition.delay - Specifies the delay time (in milliseconds ms) for each element transition.
transition.duration - Specifies the duration of each element's transition in milliseconds ms.
transition.ease - Specifies the buffer function for the transition.
transition.attr - Smoothly transition to the new attr attribute value (the starting attribute value is the current attribute).
transition.attrTween - Smooth transition between different attr attribute values (the starting attribute value can be set in the transition function, and even the entire transition function can be customized).
transition.style - Smooth transition to the new style property value.
transition.styleTween - Smooth transition between different style attribute values.
transition.text - Set text content at the beginning of the transition.
transition.tween - Transitions an attribute to a new attribute value, which can be a non-attr or non-style attribute, such as text.
transition.select - Select a child element of each current element for transition.
transition.selectAll - Select multiple child elements of each current element for transition.
transition.filter - filter out some elements in the current element through data for transition.
transition.transition - Start a new transition after the current transition is over.
transition.remove - Removes the current element after the transition is over.
transition.empty - Returns true if the transition is empty. If there is no non-null element in the current element, this transition is empty.
transition.node - Returns the first element in the transition.
transition.size - Returns the number of current elements in the transition.
transition.each - traverses each element to perform an operation. When the trigger type is not specified, the action is performed immediately. When the trigger type is specified as 'start' or 'end', an action is performed at the beginning or end of the transition.
transition.call - Execute a function with the current transition for this.
d3.ease - Customize transition buffering function.
ease - Buffer function. Buffer functions can make animations more natural, such as elastic buffer functions that can be used to simulate the movement of elastic objects. is a special case of an interpolation function.
d3.timer - Start a custom animation timing. The function is similar to setTimeout, but it is implemented internally with requestAnimationFrame, which is more efficient.
d3.timer.flush - Executes the current time without delay immediately. Can be used to deal with splash screen issues.
d3.interpolate - Generates an interpolation function that interpolates between two parameters. The type of the difference function is automatically selected according to the type of input parameters (number, string, color, etc.).
interpolate - Interpolate function. The input parameters are between [0, 1].
d3.interpolateNumber - Interpolate between two numbers.
d3.interpolateRound - Interpolate between two numbers, the return value will be rounded.
d3.interpolateString - Interpolate between two strings. When parsing the numbers in the string, the corresponding numbers will be interpolated.
d3.interpolateRgb - Interpolate between two RGB colors.
d3.interpolateHsl - Interpolate between two HSL colors.
d3.interpolateLab - Interpolate between two L*a*b* colors.
d3.interpolateHcl - Interpolate between two HCL colors.
d3.interpolateArray - Interpolate between two sequences. d3.interpolateArray( [0, 1], [1, 10, 100] )(0.5); // returns [0.5, 5.5, 100]
d3.interpolateObject - Interpolate between two objects. d3.interpolateArray( {x: 0, y: 1}, {x: 1, y: 10, z: 100} )(0.5); // returns {x: 0.5, y: 5.5, z: 100}
d3.interpolateTransform - Interpolate between two 2D affine transforms.
d3.interpolateZoom - Smoothly scales the translation between two points. Example
d3.interpolators - Add a custom interpolation function.

Working with Arrays

d3.ascending - Ascending sort function.
d3.descending - descending sort function.
d3.min - Gets the minimum value in the array.
d3.max - Gets the maximum value in the array.
d3.extent - Gets the range (minimum and maximum values) of the array.
d3.sum - Gets the sum of numbers in an array.
d3.mean - Get the arithmetic average of numbers in an array.
d3.median - Gets the median number of numbers in the array (equivalent to the value of 0.5-quantile).
d3.quantile - Gets a quantile of a sorted array.
d3.bisect - Get the insertion position of a certain number in a sorted array through dichotomy (same as d3.bisectRight).
d3.bisectRight - Gets the insertion position of a number in a sorted array (equal values are classified to the right).
d3.bisectLeft - Gets the insertion position of a number in a sorted array (equal values are classified to the left).
d3.bisector - Customize a binary function.
d3.shuffle - shuffle, randomly arrange elements in an array.
d3.permute - Arrange elements in an array in the specified order.
d3.zip - An array that combines multiple numbers into an array. The i-th element of the new array is an array composed of the i-th element in each array.
d3.transpose - matrix transpose, implemented through d3.zip.
d3.pairs - Returns an array of adjacent element pairs, d3.pairs([1, 2, 3, 4]); // returns [ [1, 2], [2, 3], [3, 4] ].
d3.keys - Returns an array composed of keys of associative arrays (hash table, json, object objects).
d3.values - Returns an array composed of the value of the associative array.
d3.entries - Returns an array composed of key-value entities of the associative array, d3.entries({ foo: 42 }); // returns [{key: "foo", value: 42}].
d3.merge - Concatenate multiple arrays into one, similar to the native method concat. d3.merge([ [1], [2, 3] ]); // returns [1, 2, 3].
d3.range - Get a sequence. d3.range([start, ]stop[, step])
d3.nest - Get a nest object that organizes the array into a hierarchy. Example: http://bl.ocks.org/phoebebright/raw/3176159/
nest.key - Adds a hierarchy to the nest hierarchy.
nest.sortKeys - Sort the current nest hierarchy by key.
nest.sortValues - Sort leaf nest hierarchy by value.
nest.rollup - Sets a function to modify the value of a leaf node.
nest.map - Perform a nest operation, returning an associative array (json).
nest.entries - Perform a nest operation, returning a key-value array. If the result returned by nest.map is similar to { foo: 42 }, the result returned by nest.entries is similar to [{key: "foo", value: 42}].
d3.map - Converts javascript's object into hash, blocking the problem of inconsistency with hash caused by the prototype chain function of object.
map.has - map returns true if there is a certain key.
map.get - Returns the value corresponding to a key in the map.
map.set - Set the value corresponding to a key in the map.
map.remove - Delete a key in the map.
map.keys - Returns an array of all keys in the map.
map.values - Returns an array of all values in the map.
map.entries - Returns an array of all entry (key-value key-value pairs) in the map. Similar to { foo: 42 } converted to [{key: "foo", value: 42}]
map.forEach - Executes a function on each entry in the map.
d3.set - converts javascript's array into set, blocking the problem of inconsistency with set caused by the array's object prototype chain function. The value in the set is the result of converting each value in the array into a string. The value in the set is deduplicated.
set.has - Returns whether set contains a value.
set.add - Add a value.
set.remove - Delete a value.
set.values - Returns an array composed of values in set. The value in set is deduplicated.
set.forEach - Executes a function for each value in set.

Math

d3.random.normal - generates a random number using a normal distribution.
d3.random.logNormal - generates a random number using a log-normal distribution.
d3.random.irwinHall - generates a random number using the IrwinHall distribution (a simple and feasible and easy to program normal distribution implementation method).
d3.transform - Convert svg's transform format into standard 2D conversion matrix string format.

Loading External Resources

d3.xhr - Initiate XMLHttpRequest request to obtain the resource.
xhr.header - Set request header.
xhr.mimeType - Set the Accept request header and override the response MIME type.
xhr.response - Set the response return value conversion function. For example function(request) { return JSON.parse(request.responseText); }
xhr.get - initiates a GET request.
xhr.post - initiate a POST request.
xhr.send - initiates a request with specified method and data.
xhr.abort - Terminates the current request.
xhr.on - Add event listeners such as "beforesend", "progress", "load" or "error" to the request.
d3.text - Request a text file.
d3.json - Request a JSON.
d3.html - Request a html text fragment.
d3.xml - Request an XML text fragment.
d3.csv - Request a CSV (comma-separated values, comma-separated values) file.
d3.tsv - Request a TSV (tab-separated values, tab-separated values) file.

String Formatting

d3.format - Converts numbers into strings in the specified format. The conversion format is very rich and very intelligent.
d3.formatPrefix - Gets a [SI prefix] object with specified values and precision. This function can be used to automatically determine the magnitude of data, such as K (thousand), M (million), etc. Example: var prefix = d3.formatPrefix(1.21e9); console.log(prefix.symbol); // "G"; console.log(prefix.scale(1.21e9)); // 1.21
d3.requote - Escape strings into formats that can be used in regular expressions. For example, d3.requote('$'); // return "/$"
d3.round - Sets how many digits to round a certain number after the decimal point. Similar to toFixed(), but returns the format number. For example, d3.round(1.23); // return 1; d3.round(1.23, 1); // return 1.2; d3.round(1.25, 1); // return 1.3

CSV formatting (d3.csv)

d3.csv - Gets a CSV (comma-separated values, colon-separated values) file.
d3.csv.parse - Converts CSV file string into an array of objects, and the key of objects is determined by the first line. For example: [{"Year": "1997", "Length": "2.34"}, {"Year": "2000", "Length": "2.38"}]
d3.csv.parseRows - An array that converts CSV file strings into arrays. For example: [ ["Year", "Length"],["1997", "2.34"],["2000", "2.38"] ]
d3.csv.format - Converts an array of object into a CSV file string, which is the inverse operation of d3.csv.parse.
d3.csv.formatRows - Convert an array of arrays into a CSV file string, which is an inverse operation of d3.csv.parseRows.
d3.tsv - Gets a TSV (tab-separated values, tab-separated values) file.
d3.tsv.parse - Similar to d3.csv.parse.
d3.tsv.parseRows - Similar to d3.csv.parseRows.
d3.tsv.format - Similar to d3.csv.format.
d3.tsv.formatRows - Similar to d3.csv.formatRows.
d3.dsv - Create a file processing object similar to d3.csv, which can customize separators and mime types. For example: var dsv = d3.dsv("|", "text/plain");

color

d3.rgb - Specify a color to create an RGB color object. Supports input in multiple color formats.
rgb.brighter - Enhance the brightness of the color, the change amplitude is determined by the parameters.
rgb.darker - Attenuates the brightness of the color, the change amplitude is determined by the parameters.
rgb.hsl - Convert RGB color objects into HSL color objects.
rgb.toString - RGB color conversion to string format.
d3.hsl - Create an HSL color object. Supports input in multiple color formats.
hsl.brighter - Enhances the brightness of the color, the change amplitude is determined by the parameters.
hsl.darker - Attenuates the brightness of the color, the change amplitude is determined by the parameters.
hsl.rgb - Convert HSL color objects into RGB color objects.
hsl.toString - HSL color conversion to string format.
d3.lab - Create a Lab color object. Supports input in multiple color formats.
lab.brighter - Enhances the brightness of the color, the change amplitude is determined by the parameters.
lab.darker - The brightness of the color is weakened, and the amplitude of the change is determined by the parameters.
lab.rgb - Converts Lab color objects into RGB color objects.
lab.toString - Lab color conversion to string format.
d3.hcl - Create an HCL color object. Supports input in multiple color formats.
hcl.brighter - Enhances the brightness of the color, the change amplitude is determined by the parameters.
hcl.darker - Attenuates the brightness of the color, the change amplitude is determined by the parameters.
hcl.rgb - Converts HCL color objects into RGB color objects.
hcl.toString - HCL color conversion to string format.

Namespace

d3.ns.prefix - Gets or extends a known XML namespace.
d3.ns.qualify - Verify whether the namespace prefix exists, such as "xlink:href" in "xlink" is a known namespace.

Internals

d3.functor - Functionalization. Convert a non-function variable into a function that returns only the value of that variable. Enter a function, return the original function; enter a value, return a function, which only returns the original value.
d3.rebind - Bind an object's method to another object.
d3.dispatch - Create a custom event.
dispatch.on - Add or remove an event listener. Multiple listeners can be added to an event.
dispatch.type - Trigger event. where 'type' is the name of the event to be fired.

d3.scale(Scales)

Quantitative Transformation

d3.scale.linear - Create a linear quantitative transformation. (It is recommended to refer to the source code to deeply understand various transformations.)
linear - Enter the value of a domain and return the value of a domain.
linear.invert - Inverse transformation, input value domain value returns the domain value.
linear.domain - get or set domain.
linear.range - get or set range.
linear.rangeRound - Sets the value range and rounds the result.
linear.interpolate - an interpolation function for get or set transform, such as replacing the default linear interpolation function with a rounded linear interpolation function d3_interpolateRound.
linear.clamp - Sets whether the value range is closed, and does not close by default. When the value range is closed, if the interpolation result is outside the value range, the boundary value of the value range will be taken. If the value range is [1, 2], the calculation result of the interpolation function is 3, if it is not closed, the final result is 3; if it is closed, the final result is 2.
linear.nice - Extend the domain scope to make the domain more regular. For example, [0.20147987687960267, 0.996679553296417] becomes [0.2, 1].
linear.ticks - Take representative values from the domain. Usually used for selection of coordinate axis scales.
linear.tickFormat - Gets the format conversion function, usually used for format conversion of axis scales. For example: var x = d3.scale.linear().domain([-1, 1]); console.log(x.ticks(5).map(x.tickFormat(5, "+%"))); // ["-100%", "-50%", "+0%", "+50%", "+100%"]
linear.copy - Copy a transformation from an existing transformation.
d3.scale.sqrt - Creates a quantitative transformation to find square roots.
d3.scale.pow - Create an exponential transformation. (Refer to the comments of the corresponding function of linear)
pow - Enter the value of a domain and return the value of a domain.
pow.invert - Inverse transformation, input the value field value returns the domain value.
pow.domain - get or set domain.
pow.range - get or set range.
pow.rangeRound - Sets the value range and rounds the result.
pow.interpolate - Interpolate function for get or set transform.
pow.clamp - Sets whether the value field is closed, and does not close by default.
pow.nice - Extend the domain scope to make the domain more regular.
pow.ticks - Take representative values from the domain. Usually used for selection of coordinate axis scales.
pow.tickFormat - Gets the format conversion function, usually used for format conversion of axis scales.
pow.exponent - Power of get or set exponent. Default is power 1.
pow.copy - Copy a transformation from an existing transformation.
d3.scale.log - Creates a logarithmic transformation. (Refer to the comments of the corresponding function of linear)
log - Enter the value of a domain and return the value of a domain.
log.invert - Inverse transformation, input the value field value returns the definition field value.
log.domain - get or set domain.
log.range - get or set range.
log.rangeRound - Set the range and round the result.
log.interpolate - Interpolate function for get or set transform.
log.clamp - Sets whether the value field is closed, and does not close by default.
log.nice - Extend the domain scope to make the domain more regular.
log.ticks - Take representative values from the domain. Usually used for selection of coordinate axis scales.
log.tickFormat - Gets the format conversion function, usually used for format conversion of axis scales.
log.copy - Copy a transformation from an existing transformation.
d3.scale.quantize - Create a quantize linear transformation, define the domain as a numerical interval, and the value domain is several discrete values.
quantize - Enter a numeric value and return a discrete value. For example: var q = d3.scale.quantize().domain([0, 1]).range(['a', 'b', 'c']); //q(0.3) === 'a', q(0.4) === 'b', q(0.6) === 'b', q(0.7) ==='c;
quantize.invertExtent - Returns the range of values that gets a discrete value. // The result of q.invertExtent('a') is [0, 0.333333333333333]
quantize.domain - The domain of get or set transformation.
quantize.range - The range of the value transformed by get or set.
quantize.copy - Copy a transformation from an existing transformation.
d3.scale.threshold - Construct a threshold (threshold) linear transformation. The domain is a separating numerical sequence of values, and the domain is a discrete value. The difference between it and quantity is that the value range specified by quantity is one interval, and then the interval is evenly divided into multiple cell intervals to correspond to discrete values. threshold specifies the boundary separation value between each cell. Example: var t = d3.scale.threshold().domain([0, 1]).range(['a', 'b', 'c']); t(-1) === 'a'; t(0) === 'b'; t(0.5) === 'b'; t(1) === 'c'; t(1000) === 'c'; t.invertExtent('a'); //returns [undefined, 0] t.invertExtent('b'); //returns [0, 1] t.invertExtent('c'); //returns [1, undefined]
threshold - Enter a numeric value and return a discrete value.
threshold.invertExtent - Enter a discrete value and return the value.
threshold.domain - The domain of get or set transformation.
threshold.range - The range of get or set transformed.
threshold.copy - Copy a transformation from an existing transformation.
d3.scale.quantile - Constructs a quantile linear transformation. The usage method is exactly similar to quantize, the difference is that quantile separates the intervals according to the median, and quantize separates the intervals according to the arithmetic average. example
quantile - Enter a numeric value and return a discrete value.
quantile.invertExtent - Enter a discrete value and return the numeric value.
quantile.domain - The domain of get or set transformation.
quantile.range - The range of the value transformed by get or set.
quantile.quantiles - Gets the separated value of the quantile transform.示例： var q = d3.scale.quantile().domain([0, 1]).range(['a', 'b', 'c']); q.quantiles() returns [0.33333333333333326, 0.6666666666666665]
quantile.copy - Copy a transformation from an existing transformation.
d3.scale.identity - Construct an identity linear transformation. Special linear transformation, this transformation definition domain is the same as the value domain, and is only used in some axis or brush modules inside d3.
identity - identity linear transformation function. Returns the input value.
identity.invert - The same as identity function, returns the input value.
identity.domain - The domain of get or set transformation.
identity.range - The range of the value transformed by get or set.
identity.ticks - Takes representative values from the domain. Usually used for selection of coordinate axis scales.
identity.tickFormat - Gets the format conversion function, usually used for format conversion of axis scales.
identity.copy - Copy a transformation from an existing transformation.

Ordinal transformation (Ordinal)

d3.scale.ordinal - build an ordinal transform object. The input definition domain and output value domain of the ordinal transform are both discrete. The input domain of the quantitative transformation is continuous, which is the biggest difference between the two.
ordinal - Enter a discrete value and return a discrete value. Input values not in the current domain will be automatically added to the domain.
ordinal.domain - The domain of get or set transformation.
ordinal.range - The value range of get or set transform.
ordinal.rangePoints - Use several discrete points to divide a continuous interval. For details, please see the legend in the link.
ordinal.rangeBands - Use several discrete intervals to divide a continuous interval. For details, please see the legend in the link.
ordinal.rangeRoundBands - Use several discrete intervals to divide a continuous interval, and the interval boundary and width will be rounded. For details, please see the legend in the link.
ordinal.rangeBand - Gets the width of the discrete interval.
ordinal.rangeExtent - Gets the minimum maximum value of the output field.
ordinal.copy - Copy a transformation from an existing transformation.
d3.scale.category10 - Construct an ordinal transformation with 10 colors.
d3.scale.category20 - Construct an ordinal transformation with 20 colors.
d3.scale.category20b - Construct an ordinal transformation with another 20 colors.
d3.scale.category20c - Construct an ordinal transformation with another 20 colors.

d3.svg (SVG)

Shapes

d3.svg.line - Creates a segment generator.
line - Generate a line in the line chart.
line.x - Set or get the x- axis accessor.
line.y - Set or get the y- axis accessor
line.interpolate - Set or get interpolation mode.
line.tension - Get or set the curve tension accessor (cardinal spline tension).
line.defined - defines whether a line exists at a certain point.
d3.svg.line.radial - Create a radiation generator.
line - Generate segmented linear curves for latitude/radar line charts.
line.radius - Get or set the radius accessor.
line.angle - Get or set an angle accessor.
line.defined - Set or get line definition accessor.
d3.svg.area - Creates a new area generator.
area - Generate a linear area for area charts.
area.x - Accessories that get or set x coordinates.
area.x0 - Get or set the accessor for x0 coordinates (baseline).
area.x1 - Get or set the accessor for x1 coordinates (backline).
area.y - Accessories that get or set y coordinates.
area.y0 - Get or set the accessor for y0 coordinates (baseline).
area.y1 - Get or set the accessor for y1 coordinates (backline).
area.interpolate - Gets or sets the interpolation mode.
area.tension - Get or set the cardinal spline tension.
area.defined - judges to obtain or define the area definition accessor.
d3.svg.area.radial - Create a new area generator.
area - Generates a linear area of segments for latitude/radar charts.
area.radius - Get or set the radius accessor.
area.innerRadius - Gets or sets the internal radius (baseline) accessor.
area.outerRadius - Get or set an external radius (backline) accessor.
area.angle - Get or set the angle accessor.
area.startAngle - Gets or sets an internal angle (baseline) accessor.
area.endAngle - Gets or sets an external angle (backline) accessor.
area.defined - judges to obtain or define the area definition accessor.
d3.svg.arc - Create radian generator.
arc - Generates a linear radian for pie chart or donut chart.
arc.innerRadius - Gets or sets the internal radius accessor.
arc.outerRadius - Gets or sets an external radius accessor.
arc.startAngle - Gets or sets the start angle accessor.
arc.endAngle - Gets or sets the end angle accessor.
arc.centroid - Calculate the center of gravity of the arc.
d3.svg.symbol - Create symbol generator.
symbol - generates the specified symbol for hashing diagrams.
symbol.type - Get or set the symbol type accessor.
symbol.size - Get or set the symbol size (in square pixels) accessor.
d3.svg.symbolTypes - Supported array of symbol types.
d3.svg.chord - Creates a new string generator.
chord - Generates a quadratic Bezier curve to connect two arcs for string diagrams.
chord.radius - Gets or sets arc radius accessor.
chord.startAngle - Gets or sets the arc start angle accessor.
chord.endAngle - Gets or sets the arc end angle accessor.
chord.source - Gets or sets the source radian accessor.
chord.target - Gets or sets the target radian accessor.
d3.svg.diagonal - Creates a new slash generator.
diagonal - Generates a two-dimensional Bessel connector for node connection diagrams.
diagonal.source - Get or set the source point accessor.
diagonal.target - Get or set the target point accessor.
diagonal.projection - Gets or sets an optional point transformer.
d3.svg.diagonal.radial - Create a new slash generator.
diagonal - Creates a two-dimensional Bessel connector for node connection diagrams.

Axes

d3.svg.axis - Create an axis generator.
axis - Formal generation of axis in the page.
axis.scale - The scale transformation of get or set axis, which sets the conversion rules for numerical and pixel positions.
axis.orient - get or set axis scale direction.
axis.ticks - Controls how the axis scale is generated.
axis.tickValues - Sets the value of a specific axis.
axis.tickSize - Specifies the pixel length of the tick mark on the axis.
axis.innerTickSize - the pixel length of the get or set axis small tick mark.
axis.outerTickSize - the pixel length of the get or set axis large tick mark.
axis.tickPadding - Specifies the pixel distance between the axis scale and the tick text.
axis.tickFormat - Sets the format of the tick text.

Controls

d3.svg.brush - Click to drag and select a two-dimensional area.
brush - Officially bind a brush in an area of the page.
brush.x - Get or set brush x transformation, used for horizontal drag and drop.
brush.y - Get or set brush y transformation, used for dragging and dropping in a vertical direction.
brush.extent - get or set brush selection range (extent).
brush.clear - Sets the selection range (extent) of brush to empty.
brush.empty - determines whether the selection range (extent) of brush is empty.
brush.on - event listener for get or set brush. There are 3 types of events that can be listened to: brushstart, brush, brushend.
brush.event - Triggers the listening event through the program and uses it after setting the extent through the program.

d3.time (Time)

Time Formatting

d3.time.format - Create a local time format converter based on a certain time format.
format - Convert a date object to a string in a specific time format.
format.parse - Converts strings in a specific time format to date object.
d3.time.format.utc - Create a Universal Standard Time (UTC) format converter based on a certain time format.
d3.time.format.iso - Creates an ISO World Standard Time (ISO 8601 UTC) format converter based on a certain time format.

Time Scales

d3.time.scale - Creates a linear time transformation with the definition field as a numerical interval and the value field as a time interval. Commonly used for the creation of time axis. For details, please refer to d3.scale.linear.
scale - Enter as a value, return as a time.
scale.invert - Inverse transformation, input time to return the value.
scale.domain - The domain of get or set transformation.
scale.nice - Extend the domain scope to make the domain more regular.
scale.range - The range of the get or set transform.
scale.rangeRound - Sets the range and rounds the result.
scale.interpolate - an interpolation function for get or set transform, such as replacing the default linear interpolation function with an exponential interpolation function.
scale.clamp - Sets whether the value range is closed, and does not close by default. When the value range is closed, if the interpolation result is outside the value range, the boundary value of the value range will be taken. For details, please refer to linear.clamp.
scale.ticks - Take representative values from the domain. Usually used for selection of coordinate axis scales.
scale.tickFormat - Gets the format conversion function, usually used for format conversion of axis scales.
scale.copy - Copy a transformation from an existing time transformation.

Time Intervals

d3.time.interval - Returns a time interval for the local time.
interval - The effect is the same as the interval.floor method.
interval.range - Returns the date within the specified interval.
interval.floor - Round down to the nearest interval value.
interval.round - Round up or down to the nearest interval value.
interval.ceil - Round to the nearest interval value.
interval.offset - Returns the date offset of the specified time interval.
interval.utc - Returns the corresponding UTC time interval.
d3.time.day - Returns the time when the specified time is based on the start of the day (the default start is 12:00am).
d3.time.days - Returns all times based on days for the specified time interval and interval conditions, with the same effect as day.range.
d3.time.dayOfYear - Calculates the number of days in the year specified.
d3.time.hour - Returns the time (eg, 1:00 AM) at which the specified time is based on the hour start.
d3.time.hours - Returns all hours based on hours for the specified time interval and interval conditions, the same as hour.range.
d3.time.minute - Returns the time (eg, 1:02 AM) at which the specified time is based on the start of the minute.
d3.time.minutes - Returns all minutes based times for the specified time interval and interval conditions, the same as minute.range.
d3.time.month - Returns the time when the specified time is based on the month's start (eg, February 1, 12:00 AM).
d3.time.months - Returns all times based on the month of the specified time interval and interval condition, with the same effect as month.range.
d3.time.second - Returns the time (eg, 1:02:03 AM) at which the specified time starts based on the second.
d3.time.seconds - Returns all times based on seconds for the specified time interval and interval condition, the effect is the same as second.range.
d3.time.sunday - Returns the time specified based on Sunday's start (eg, February 5, 12:00 AM).
d3.time.sundays - Returns all times based on sunday for specified time intervals and interval conditions, the same as sunday.range.
d3.time.sundayOfYear - Calculates the number of weeks of a specified time based on sunday.
d3.time.monday - every Monday (eg, February 5, 12:00 AM).
d3.time.mondays - alias for monday.range.
d3.time.mondayOfYear - computes the monday-based week number.
d3.time.tuesday - every Tuesday (eg, February 5, 12:00 AM).
d3.time.tuesdays - alias for tumorday.range.
d3.time.tuesdayOfYear - computes the Tuesday-based week number.
d3.time.wednesday - every Wednesday (eg, February 5, 12:00 AM).
d3.time.wednesdays - alias for wedding.range.
d3.time.wednesdayOfYear - computes the wedding-based week number.
d3.time.thursday - every Thursday (eg, February 5, 12:00 AM).
d3.time.thursdays - alias for thursday.range.
d3.time.thursdayOfYear - computes the thursday-based week number.
d3.time.friday - every Friday (eg, February 5, 12:00 AM).
d3.time.fridays - alias for Friday.range.
d3.time.fridayOfYear - computes the Friday-based week number.
d3.time.saturday - every Saturday (eg, February 5, 12:00 AM).
d3.time.saturdays - alias for saturday.range.
d3.time.saturdayOfYear - computes the satisfaction-based week number.
d3.time.week - alias for sunday.
d3.time.weeks - alias for sunday.range.
d3.time.weekOfYear - alias for sundayOfYear.
d3.time.year - Returns the time specified based on the start of the year (eg, January 1, 12:00 AM).
d3.time.years - Returns all times of the specified time interval and interval conditions, the effect is the same as year.range.

Composition (d3.layout)

Bundle

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

Chord

d3.layout.chord - Initialize a string diagram object and return a Chord instance
chord.matrix - Set or get the matrix data corresponding to the string diagram instance
chord.padding - Set or get the spacing angle between arcs in each section of the string diagram
chord.sortGroups - Set or get sorting function for matrix grouping
chord.sortSubgroups - Set or get sorting function for secondary grouping of matrix
chord.sortChords - Set or get the sorting function of the string graph in z order (determines which group is displayed at the top level)
chord.chords - This function will process the parameters into a more chord-friendly format and return them. If no parameters are provided, matrix() will be called to obtain the data.
chord.groups - This function parameter is processed into easier to understand grouping information. If no parameters are provided, matrix() will be called to obtain data.

Cluster

d3.layout.cluster - Generate a cluster layout object with default settings.
cluster.sort - Gets or sets a function to sort the sibling nodes (child nodes of the same parent node).
cluster.children - Get or set the accessor for child nodes.
cluster.nodes - 计算并返回指定结点的子结点在集群中的信息(坐标,深度等).
cluster.links - 指定一个子结点数组(通常是nodes函数返回值), 计算它们与父结点的连接信息.
cluster.separation - 获取或设置相邻结点间的间隔(不仅限于兄弟结点).
cluster.size - 获取或设置布局的宽和高的大小.
cluster.nodeSize - 为结点指定大小.

力学(Force)

d3.layout.force -节点（node）基于物理模拟的位置连接。
force.on - 监听布局位置的变化。(仅支持”start”,”step”,”end”三种事件)
force.nodes - 获得或设置布局中的节点（node）阵列组。
force.links - 获得或设置布局中节点间的连接（Link）阵列组。 .
force.size - 获取或设置布局的宽和高的大小.
force.linkDistance - 获取或设置节点间的连接线距离.
force.linkStrength - 获取或设置节点间的连接强度.
force.friction - 获取或设置摩擦系数.
force.charge - 获取或设置节点的电荷数.(电荷数决定结点是互相排斥还是吸引)
force.gravity - 获取或设置节点的引力强度.
force.theta - 获取或设置电荷间互相作用的强度.
force.start - 开启或恢复结点间的位置影响.
force.resume - 设置冷却系数为0.1,并重新调用start()函数.
force.stop - 立刻终止结点间的位置影响.(等同于将冷却系数设置为0)
force.alpha - 获取或设置布局的冷却系数.(冷却系数为0时,节点间不再互相影响)
force.tick - 让布局运行到下一步.
force.drag - 获取当前布局的拖拽对象实例以便进一步绑定处理函数.

层级布局(Hierarchy)

d3.layout.hierarchy - 获得一个自定义的层级布局的实现.
hierarchy.sort - 获取或设置一个函数, 用来给兄弟节点(同一父结点的子结点)的排序.
hierarchy.children - 获取或设置子结点的访问器.
hierarchy.nodes - 计算并返回指定结点的子结点信息.
hierarchy.links - 指定一个子结点数组(通常是nodes函数返回值), 计算它们与父结点的连接信息.
hierarchy.value - 获取或设置结点的值访问器.
hierarchy.revalue - 重新计算层级布局.

直方图(Histogram)

d3.layout.histogram - 构建一个默认直方图(用来表示一组离散数字的分布,横轴表示区间,纵轴表示区间内样本数量或样本百分比).
histogram.value - 获取或设置值访问器.
histogram.range - 获取或设置合法值范围.
histogram.bins - 指定如何将数据分组到不同的区间(bin)里, 返回一个构造函数.
histogram - 根据已设置的区间将数据分组,返回已分组的二维数组(compute the distribution of data using quantized bins).
histogram.frequency - 设置直方图Y轴值是区间内数据的总量还是百分比(compute the distribution as counts or probabilities).

层包(Pack)

d3.layout.pack - 用递归的圆环表现一个多层级布局.
pack.sort - 获取或设置一个函数, 用来给兄弟节点(同一父结点的子结点)排序.
pack.children - 获取或设置子结点的访问器.
pack.nodes - 计算并返回指定结点的子结点信息.
pack.links - 指定一个子结点数组(通常是nodes函数返回值), 计算它们与父结点的连接信息.
pack.value - 获取或设置一个函数, 用来计算圆环的大小(近似值).
pack.size - 设置整个布局画布的宽and高.
pack.radius - 如果不想结点半径与结点的值相同, 可以传入一个函数用来计算结点半径.
pack.padding - 指定相邻结点之点的间距(近似值).

分区(Partition)

d3.layout.partition - 将一棵树递归的分区.
partition.sort - 获取或设置一个函数, 用来给兄弟节点(同一父结点的子结点)排序.
partition.children - 获取或设置子结点的访问器.
partition.nodes - 计算并返回指定结点的子结点信息.
partition.links - 指定一个子结点数组(通常是nodes函数返回值), 计算它们与父结点的连接信息.
partition.value - 设置一个函数来来计算分区的值.
partition.size - 设置整个布局画布的宽and高.

饼图(Pie)

d3.layout.pie - 构建一个默认的饼图.
pie - 该函数将传入的原始参数转换成可用于饼图或者环形图的数据结构.
pie.value - 获取或设置值访问器.
pie.sort - 设置饼图顺时针方向的排序方法.
pie.startAngle - 设置或获取整个饼图的起始角度.
pie.endAngle - 设置或获取整个饼图的终止角度.

堆叠图(Stack)

d3.layout.stack - 构建一个默认的堆叠图(用来展示一系列x轴相同的面积图或者立方图).
stack - 计算每一层的基线.
stack.values - 设置或者获取每层的值访问器.
stack.order - 设置每层的排序.
stack.offset - 指定总的基线算法.
stack.x - 设置或获取每层的x轴访问器.
stack.y - 设置或获取每层的y轴访问器.
stack.out - 设置或获取用来储存基线的输出函数.

树(Tree)

d3.layout.tree - position a tree of nodes tidily.
tree.sort - 设置或获取一个函数, 用来给兄弟节点(同一父结点的子结点)排序.
tree.children - 设置或获取子结点的访问器.
tree.nodes - 计算并返回指定结点的子结点信息.
tree.links - 指定一个子结点数组(通常是nodes函数返回值), 计算它们与父结点的连接信息.
tree.separation - 设置或获取相隔结点之间的间隔计算函数.
tree.size - 指定整个布局的宽和高.
tree.nodeSize - 给全部结点指定一个固定的大小(会导致tree.size失效).

矩阵树(Treemap)

d3.layout.treemap - 返回一个矩阵树对象(用矩阵来展示一颗树).
treemap.sort - 设置或获取一个函数, 用来给兄弟节点(同一父结点的子结点)排序.
treemap.children - 设置或获取子结点的访问器.
treemap.nodes - 计算并返回指定结点的子结点信息.
treemap.links - 指定一个子结点数组(通常是nodes函数返回值), 计算它们与父结点的连接信息.
treemap.value - 设置或获取一个用来计算单元格大小的值访问器.
treemap.size - 指定整个布局的宽和高.
treemap.padding - 指定父结点和子结点的间距.
treemap.round - 禁用或启用边界补偿.
treemap.sticky - 让布局更”粘”以保证在更新数据时有平滑的动画效果.
treemap.mode - 更改矩阵树的布局算法.

d3.geo (Geography)

Paths

d3.geo.path - 创建一个新的地理路径生成器.
path - 投射指定的特性并且渲染到上下文.
path.projection - 获取活设置地理投影.
path.context - 获取活设置渲染上下文.
path.pointRadius -获取或设置半径去现实点的特性.
path.area - 计算指定特性的投射区域.
path.centroid - 计算指定特性的投射重心点.
path.bounds - 计算指定特性的投射边界.
d3.geo.graticule - 创建地理坐标网生成器.
graticule - 生产一个子午线或平行线的MultiLineStrings.
graticule.lines - 生成一个子午线和平行线的LineString的数组.
graticule.outline - 生成一个表示该坐标网的外框多边形.
graticule.extent - 获取或设置主要的和次要的范围.
graticule.majorExtent - 获取或设置主要范围.
graticule.minorExtent - 获取或设置次要范围.
graticule.step - 获取或设置主要和次要的步间隔.
graticule.majorStep - 获取或设置主要的步间隔.
graticule.minorStep - 获取或设置次要的步间隔.
graticule.precision - 设置或者获取横向精度.
d3.geo.circle - 创建一个圆形的生成器.
circle - 使用多边形来生成一个分段的圆形.
circle.origin - 通过横向和纵向坐标来指定原点.
circle.angle - 指定以度为单位的角半径.
circle.precision - 指定分段圆的精度.
d3.geo.area - 根据给定特征计算球面面积.
d3.geo.bounds - compute the latitude-longitude bounding box for a given feature.
d3.geo.centroid - compute the spherical centroid of a given feature.
d3.geo.distance - compute the great-arc distance between two points.
d3.geo.interpolate - interpolate between two points along a great arc.
d3.geo.length - compute the length of a line string or the circumference of a polygon.
d3.geo.rotation - create a rotation function for the specified angles [λ, φ, γ].
rotation - rotate the given location around the sphere.
rotation.invert - inverse-rotate the given location around the sphere.

Projections

d3.geo.projection - create a standard projection from a raw projection.
projection - project the specified location.
projection.invert - invert the projection for the specified point.
projection.rotate - get or set the projection's three-axis rotation.
projection.center - get or set the projection's center location.
projection.translate - get or set the projection's translation position.
projection.scale - get or set the projection's scale factor.
projection.clipAngle - get or set the radius of the projection's clip circle.
projection.clipExtent - get or set the projection's viewport clip extent, in pixels.
projection.precision - get or set the precision threshold for adaptive resampling.
projection.stream - wrap the specified stream listener, projecting input geometry.
d3.geo.projectionMutator - create a standard projection from a mutable raw projection.
d3.geo.albers - the Albers equal-area conic projection.
albers.parallels - get or set the projection's two standard parallels.
d3.geo.albersUsa - a composite Albers projection for the United States.
d3.geo.azimuthalEqualArea - the azimuthal equal-area projection.
d3.geo.azimuthalEquidistant - the azimuthal equidistant projection.
d3.geo.conicConformal - the conic conformal projection.
d3.geo.conicEquidistant - the conic equidistant projection.
d3.geo.conicEqualArea the conic equal-area (aka Albers) projection.
d3.geo.equirectangular - the equirectangular (plate carreé) projection.
d3.geo.gnomonic - the gnomonic projection.
d3.geo.mercator - the spherical Mercator projection.
d3.geo.orthographic - the azimuthal orthographic projection.
d3.geo.stereographic - the azimuthal stereographic projection.
d3.geo.azimuthalEqualArea.raw - the raw azimuthal equal-area projection.
d3.geo.azimuthalEquidistant.raw - the azimuthal equidistant projection.
d3.geo.conicConformal.raw - the raw conic conformal projection.
d3.geo.conicEquidistant.raw - the raw conic equidistant projection.
d3.geo.conicEqualArea.raw the raw conic equal-area (aka Albers) projection.
d3.geo.equirectangular.raw - the raw equirectangular (plate carrée) projection.
d3.geo.gnomonic.raw - the raw gnomonic projection.
d3.geo.mercator.raw - the raw Mercator projection.
d3.geo.orthographic.raw - the raw azimuthal orthographic projection.
d3.geo.stereographic.raw - the raw azimuthal stereographic projection.
d3.geo.transverseMercator.raw - the raw transverse Mercator projection.

Streams

d3.geo.stream - convert a GeoJSON object to a geometry stream.
stream.point - indicate an x , y (and optionally z ) coordinate.
stream.lineStart - indicate the start of a line or ring.
stream.lineEnd - indicate the end of a line or ring.
stream.polygonStart - indicate the start of a polygon.
stream.polygonEnd - indicate the end of a polygon.
stream.sphere - indicate a sphere.
d3.geo.transform - transform streaming geometries.
transform.stream - wraps a given stream.
d3.geo.clipExtent - a stream transform that clips geometries to a given axis-aligned rectangle.
clipExtent.extent - sets the clip extent.

d3.geom (Geometry)

Voronoi

d3.geom.voronoi - create a Voronoi layout with default accessors.
voronoi - compute the Voronoi tessellation for the specified points.
voronoi.x - get or set the x-coordinate accessor for each point.
voronoi.y - get or set the y-coordinate accessor for each point.
voronoi.clipExent - get or set the clip extent for the tesselation.
voronoi.links - compute the Delaunay mesh as a network of links.
voronoi.triangles - compute the Delaunay mesh as a triangular tessellation.

Quadtree

d3.geom.quadtree - constructs a quadtree for an array of points.
quadtree.add - add a point to the quadtree.
quadtree.visit - recursively visit nodes in the quadtree.

Polygon

d3.geom.polygon - create a polygon from the specified array of points.
polygon.area - compute the counterclockwise area of this polygon.
polygon.centroid - compute the area centroid of this polygon.
polygon.clip - clip the specified polygon to this polygon.

Hull

d3.geom.hull - create a convex hull layout with default accessors.
hull - compute the convex hull for the given array of points.
hull.x - get or set the x -coordinate accessor.
hull.y - get or set the y -coordinate accessor.

d3.behavior (Behaviors)

Drag

d3.behavior.drag
drag.origin
drag.on

缩放Zoom

d3.behavior.zoom - 创建一个缩放行为.
zoom - 对指定元素应用缩放.
zoom.scale - the current scale factor.
zoom.translate - the current translate offset.
zoom.scaleExtent - optional limits on the scale factor.
zoom.center - an optional focal point for mousewheel zooming.
zoom.size - the dimensions of the viewport.
zoom.x - an optional scale whose domain is bound to the x extent of the viewport.
zoom.y - an optional scale whose domain is bound to the y extent of the viewport.
zoom.on - listeners for when the scale or translate changes.
zoom.event - dispatch zoom events after setting the scale or translate.