3.0 - zziuni/d3 GitHub Wiki

Wiki ▸ Release Notes ▸ 3.0

[Japanese]

The page covers new features in 3.0; see Upgrading to 3.0 for how to migrate from 2.x to 3.0.

Antimeridian Cutting	Three-Axis Rotation	Rotating Winkel-Tripel	Rotating Equirectangular
Clipping	Adaptive Resampling	Canvas Rendering	Satellite & Graticule
Projection Transitions	Choropleth	Raster Reprojection

D3 includes a powerful new geographic projection system! Whereas previous versions of D3 only understood projections as point functions, D3 3.0 models projections as full geometry transformations. Thus, when straight lines are projected to curves, D3 applies configurable adaptive resampling to subdivide lines and eliminate projection artifacts; see for example the smooth appearance of Antarctica in the Larrivée and Van der Grinten projections. When lines or polygons cross the antimeridian, D3 cuts the geometry, rather than relying on pre-cut shapefiles. All projections now support small circle clipping and three-axis rotation.

Under the hood, D3 uses streaming geometry transformations (d3.geo.stream) that reduce memory by avoiding temporary objects. This design also enables direct-to-canvas rendering with dramatic performance improvements! Streams are used to compute projected area, centroid and bounds consistent with displayed geometry, and can even filter geometry for scale-dependent shape simplification.

The d3.geo package includes a number of useful new components, such as a graticule for displaying grid lines and sphere rendering for globe outlines. The d3.geo.circle class now supports small and great circle rendering, so you can approximate Tissot's indicatrix. A new d3.geo.interpolate simplifies interpolation of spherical coordinates along great arcs, and there are even new functions for accurately computing spherical area, centroid and bounds.

Peirce Quincuncial	Wagner VI	Equidistant Conic	Mollweide
Sinu-Mollweide	Goode Homolosine	Van der Grinten	d3.hexbin
d3.geo.tile	TopoJSON	Map Coloring	Smooth Zooming

The extended geographic projections plugin brings the number of supported projections to over 40! You can also compose new custom projections using d3.geo.projection and d3.geo.projectionMutator. The d3.geo.tile plugin makes it easy to drop-in 256x256 raster tiles into your map visualization. In conjunction with d3.behavior.zoom, you can quickly create slippy maps. The d3.hexbin and d3.interpolateZoom plugins are also useful for mapping.

TopoJSON is an extension to GeoJSON that typically provides 80-90% smaller file sizes. It also encodes topology, enabling topology-preserving shape simplification (à la MapShaper), map coloring, cartograms, boundary mesh computation, and more! TopoJSON is not a D3 plugin per se, but simply a standalone JavaScript library for converting TopoJSON to GeoJSON; a future release of d3.geo may add native TopoJSON support.

Chained Transitions, I	Chained Transitions, II	Chained Transitions, III	Chained Transitions, IV
Transition Reselection, I	Transition Reselection, II

D3’s transitions now bind tweens and other transition state to the DOM, similar to how data is bound to selections. This means you can now reselect scheduled transitions from the DOM and modify them, say for customized axes. You can also inspect them in the JavaScript console for easier debugging.

To make transitions easier to use, value functions are now evaluated immediately by transition.attr and transition.style, rather than waiting until the transition starts. This greatly simplifies chained transitions that depend on external state, such as scale domains. The transition.transition method now creates a transition that starts when the previous transition ends (rather than a concurrent transition), so you can chain transitions without listening for "end" events.

For more on how transitions work in D3, see the Working with Transitions tutorial, and the section on transitions in Upgrading to 3.0.

Progress Events

d3.xhr + Queue.js

D3's asynchronous methods for issuing requests now return a d3.xhr object. This offers much greater control over the request. You can have multiple listeners, including separate listeners for progress, load and error events. You can use xhr.abort to cancel in-flight requests, xhr.header to add request headers, and xhr.send to customize the HTTP method and body data. Also, D3 now begrudgingly provides CORS compatibility for IE9 by way of Microsoft's nonstandard XDomainRequest object.

The asynchronous request methods now support the Node.js callback pattern, where the first argument to the callback is the error, and the second argument is the result. This makes d3.xhr compatible with asynchronous JavaScript helper libraries, such as Queue.js, which makes it much easier to load multiple resources in parallel. See the section on requests in Upgrading to 3.0 for examples.

In addition to all of the above, D3 includes a handful of bug fixes, performance improvements, and minor new features. A new d3.shuffle method provides the Fisher–Yates shuffle. The d3.format class now supports align and fill, and both d3.format and d3.time.format support POSIX localization at build time. The d3.layout.treemap now supports the "slice-and-dice" algorithm. Lastly, all of the D3 examples have been moved to bl.ocks.org and GitHub Gist for easier browsing & forking.