Level Up Your D3 Charts: Exploring d3-3d v2.0.0

d3-3d exists for one simple reason:

to take D3’s familiar data-driven approach and extend it into 3D space, without jumping into WebGL or heavy frameworks.

With v2.0.0, d3-3d gets its biggest upgrade so far: TypeScript support, a cleaner API, and much better documentation.

What is d3-3d?

d3-3d is a small helper library that lets you:

• Work with 3D data (x, y, z)


• Project it into 2D SVG


• Keep using D3 selections, joins, and transitions

It focuses on projection and geometry, not on being a full 3D engine.

What’s new in v2.0.0?

1) First-class TypeScript support

d3-3d now ships with proper TypeScript definitions.

Better autocomplete, safer refactors, less guessing.

2) A cleaner, more explicit API

Shapes no longer act like callable functions that implicitly accept data.

Instead, data is passed explicitly via .data().

Before (v1.x):

const projected = triangles3D(data);

Now (v2.0.0):

const projected = triangles3D().data(data);

It’s a breaking change, but it makes the API far more predictable and type-friendly.

The sort function is not attached any more to each shape class, it gets exported directly.

Before (v1.x):

import {

    triangles3D,

} from "d3-3d";



// ... some code



svg.append("g")

   .selectAll(".d3-3d")

   .sort(triangles3D.sort);

Now (v2.0.0):

import {

    sort,

} from "d3-3d";



// ... some code



svg.append("g")

   .selectAll(".d3-3d")

   .sort(sort);

3) Computed properties, now properly documented

Computed properties like centroid, orientation, and transformed coordinates already existed before, but were hard to discover and poorly documented.

v2.0.0 improves:

• Documentation


• Examples


• Practical explanations

These properties are especially useful for things like label placement, interaction logic, or depth-aware rendering.

For depth sorting specifically, d3-3d exports a standalone sort helper, rather than baking sorting into every shape.

Why this release matters

v2.0.0 doesn’t add flashy features — it makes d3-3d easier to use, easier to understand, and safer in modern setups.

If you’re comfortable with D3 and want to add depth without switching stacks, this release is a solid step forward.

https://github.com/Niekes/d3-3d