Commit b20b8ee6 authored by Mike Bostock's avatar Mike Bostock
Browse files


parent 4991ea3c
......@@ -362,47 +362,21 @@ There’s now a nice [visual reference](
## [Forces (d3-force)](
* velocity verlet instead of position verlet
* deterministic initialization and forces; D3 does not play dice!
* d3.layout.force ↦ d3.forceSimulation
* *force*.friction ↦ *force*.drag
the simulation is extensible rather than hard-coding several forces:
* *force*.gravity ↦ d3.forceX, d3.forceY
* *force*.charge ↦ d3.forceManyBody
* *force*.link ↦ d3.forceLink
* new d3.forceCenter
* new d3.forceCollision - more stable than prior examples, too
* new *forceManyBody*.distanceMin
the new forces are more flexible, and better:
The force layout d3.layout.force has been renamed to d3.forceSimulation. The force simulation now uses [velocity Verlet integration]( rather than position Verlet, tracking the nodes’ positions (*node*.x, *node*.y) and velocities (*node*.vx, *node*.vy) rather than their previous positions (*node*.px, *node*.py).
* force strengths can typically be configured per-node or per-link
* separate positioning forces for *x* and *y*
* better default link strength and bias heuristics to improve stability
Rather than hard-coding a set of built-in forces, the force simulation is now extensible: you specify which forces you want. In addition to being more composable, each force is now more flexible in its configuration: force parameters can typically be configured per-node or per-link. There are separate positioning forces for [*x*]( and [*y*]( that replace *force*.gravity, and you can specify different target positions and strengths for each node. The new [link force]( replaces *force*.linkStrength and employs better default heuristics to improve stability. The new [many-body force]( replaces *force*.charge and supports a new [minimum-distance parameter]( and performance improvements thanks to 4.0’s [new quadtrees](#quadtrees-d3-quadtree). There are also brand-new forces for [centering nodes]( and [collision resolution](
easier controls for heating and cooling the layout:
The new forces and the initialization behavior of the simulation have been carefully crafted to avoid nondeterminism. Rather than initializing nodes randomly, if the nodes do not have preset positions, they are placed in a phyllotaxis pattern:
* *simulation*.alpha
* *simulation*.alphaMin - control when the internal timer stops
* *simulation*.alphaDecay - control how quickly the simulation cools
* *simulation*.alphaTarget - smooth reheating during interaction!
<img alt="Phyllotaxis" src="" width="420" height="219">
better controls for starting and stopping the internal timer, independent of heat:
Random jitter is still applied to resolve link, collision and many-body forces if there are coincident nodes, but at least in the common case, this means that the behavior of the force simulation (the resulting force-directed graph layout) is consistent across browsers and reloads. D3 no longer plays dice!
* *simulation*.restart
* *simulation*.stop
* *simulation*.tick
The force simulation sports several new methods for greater control over heating and cooling, and for controlling the internal timer, such as [*simulation*.alphaMin]( and [*simulation*.alphaDecay]( Calling [*simulation*.alpha]( had no effect on the internal timer, which is now controlled independently via [*simulation*.stop]( and [*simulation*.restart]( You can still advance the simulation manually using [*simulation*.tick]( The *force*.friction parameter is replaced by *simulation*.velocityDecay.
the dependency on the drag behavior is removed. instead:
A new [*simulation*.alphaTarget]( method allows you to set the desired alpha (temperature) of the simulation, such that the simulation can be smoothly reheated during interaction, and then smoothly cooled again. This improves the stability of the graph during interaction.
* *simulation*.fix
* *simulation*.unfix
* *simulation*.unfixAll
* *simulation*.find
The force layout no longer depends on the [drag behavior](#dragging-d3-drag), though you can certainly create [draggable force-directed graphs](! Set *node*.fx and *node*.fy to fix a node’s position. As an alternative to a [Voronoi](#voronoi-d3-voronoi) SVG overlay, you can now use [*simulation*.find]( to find the closest node to a pointer.
## [Number Formats (d3-format)](
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment