d3-force-registry

A curated compilation of plugins and all-things related to d3-force.

Please get in touch for any additions/corrections to this list. And as always, use the force!

Force Plugins

Plugin	Description	Code	Examples
d3.bboxCollide	Repelling force that prevents rectangular nodes from overlapping with each other. Great for avoiding label overlaps.	d3-bboxCollide	Guitar hero Word clouds Bbox Collide
d3.forceAttract	Spring-like force to attract nodes to a particular <x,y> point.	d3-force-attract	Mouse following Multiple attraction
d3.forceBounce	Elastic collision force between nodes. Useful to simulate natural collisions between circular objects that conserve energy and momentum.	d3-force-bounce	Newton's cradle Entropy Brownian motion
d3.forceBoundary	Spring-like force to keep nodes within a rectangular container.	d3-force-boundary	Force Boundary Demo Disjoint Graph
d3.forceCenter	Translate all nodes as a group towards the center of the canvas. Manipulates nodes coordinates directly, instead of their velocity.	d3-force (core)	Force-directed graph
d3.forceConstant	Constant acceleration force. Useful to simulate permanent influences like weight and wind.	d3-force-constant	Pendulum
d3.forceClustering	Spring-like attraction force that groups nodes into clusters.	d3-force-clustering	Cluster layout
d3.forceCollide	Repelling force that prevents circular nodes from overlapping with each other.	d3-force (core)	Collision detection Cluster Collision Hamilton characters
d3.forceElastic	Spring-like attraction force applied to node-pairs.	d3-force-elastic	Double Pendulum
d3.forceGravity	Gravity-like (inverse-square distance) force to attract nodes to a particular <x,y> point.	d3-force-gravity	Gravity demo
d3.forceGrid	Force that snaps nodes onto a grid.	d3-force-grid	Grid layout
d3.forceLimit	Hard limit nodes positions to a specified range, with optionally a cushioning effect.	d3-force-limit	Cushioned Walls Container Boundaries
d3.forceLink	Spring-like attraction/repulsion force applied to node-pairs.	d3-force (core)	Force-directed tree Lattice
d3.forceMagnetic	Inverse-square (distance) attraction/repulsion force applied to all nodes or dedicated node-pair edges. Useful to simulate natural occurring forces such as gravity or electrostatic.	d3-force-magnetic	Accretion Orbits
d3.forceManyBody	Inverse-linear (distance) attraction/repulsion force applied to all nodes. Typically used as node repulsion in force-directed graphs for a distributed spread.	d3-force (core)	Disjoint graph
d3.forceManyBodyReuse	Faster inverse-linear (distance) attraction/repulsion force applied to all nodes. Typically used as node repulsion in force-directed graphs for a distributed spread. Runs faster than d3.forceManyBody by reusing approximations.	d3-force-reuse	Les Miserables graph Speed comparison
d3.forceManyBodySampled	Linear-time inverse-linear (distance) attraction/repulsion force applied to all nodes. Typically used as node repulsion in force-directed graphs for a distributed spread. Runs faster than d3.forceManyBody and d3.forceManyBodyReuse by using the Random Vertex Sampling algorithm.	d3-force-sampled	Speed comparison with Barnes-Hut Animated layout
d3.forceRadial	Spring-like force to attract nodes towards the closest point on a circle or sphere surface.	d3-force (core)	Radial force 3D Radial force
d3.forceSlope	Force that quantizes link slopes to fixed angles.	d3-force-slope	Slope-quantized links
d3.forceStraighten	Force that straightens chains of connected nodes into rigid lines using linear regression.	d3-force-straighten	Straighten Arms
d3.forceSurface	Elastic collision force between nodes and surfaces, defined as line-segments.	d3-force-surface	Pong Particle container
d3.forceX	Horizontal spring-like attraction force.	d3-force (core)	Beeswarm
d3.forceY	Vertical spring-like attraction force.	d3-force (core)	Vertical beeswarm
d3.forceZ	Spring-like attraction force in the Z dimension for 3D representations.	d3-force-3d	-
forceInABox	Force implementation of the group-in-a-box layout algorithm.	forceInABox	Force in a box

Modules

Name	Description	Code	Example
d3-force-3d	Extended version of d3-force to run simulations in 3D or 1D.	d3-force-3d	Multi-dimensional force simulation
d3.forceEdgeBundling	Force-directed edge bundling algorithm. Self-organise edges on thick mesh graphs to decrease visual clutter.	d3.forceBundle	Force-directed Edge Bundling US airline routes FDEB on force-directed graph
d3-force-pod	Scaffolding component that automatically draws nodes/links according to a set of forces, for easy prototyping of force simulations.	d3-force-pod	Use the Force Plasma

Prototype Ideas

Name	Description	Example
Brownian motion	Random particles hit the nodes and change their speeds.	Brownian Motion Urquhart
K-Means	K-means clusters can be computed as a force that colors nodes.	K-Means as a force
tSNE	tSNE computes positions in a webworker, and those positions are used as a force (allowing nodes to converge to their tSNE position while negotiating collisions etc.)	tSNE applied as a force