<script setup> import ExampleDisjointForce from "./components/ExampleDisjointForce.vue"; </script>

d3-force

<ExampleDisjointForce />

This module implements a velocity Verlet numerical integrator for simulating physical forces on particles. Force simulations can be used to visualize networks and hierarchies, and to resolve collisions as in bubble charts.

<!-- [](https://observablehq.com/@d3/force-directed-graph/2) --> <!-- [](https://observablehq.com/@d3/force-directed-tree) --> <!-- [](https://observablehq.com/@d3/collision-detection) --> <!-- You can even use it as a rudimentary physics engine, say to simulate cloth: --> <!-- [](https://observablehq.com/@d3/force-directed-lattice) -->

To use this module, create a simulation for an array of nodes and apply the desired forces. Then listen for tick events to render the nodes as they update in your preferred graphics system, such as Canvas or SVG.

See one of:

• Force simulations
• Center force
• Collide force
• Link force
• Many-body force
• Position forces