Skip to content

adel-tahir/d3-ellipseCollide

Repository files navigation

d3-elllipse-collision

Modular force for use with D3's forceSimulation.

Detect collision of ellipses.

Installing

npm

We haven't published as npm yet.

CDN (UNPKG), via <script>

We haven't uploaded to any CDN yet.

Local, via <script>

Download the latest release

<script src="./d3-ellipse-collision.js"></script>

Usage

Accessing the module

The install method you use determines the syntax for accessing the module in your code:

npm

Import the ellipseCollide() method and use it in a forceSimulation.

import { ellipseCollide } from './d3-ellipse-collision'
// ...
d3.forceSimulation
	.force('collide', ellipseCollide()
	.radius(function(d) { return [d.rx, d.ry]; }));

via <script> or CDN (UNPKG)

The ellipseCollide() method is available in the global ellipseCollision namespace.

d3.forceSimulation
	.force('collide', ellipseCollision.ellipseCollide()
	.radius(function(d) { return [d.rx, d.ry]; }));

API

The ellipseCollide module follows the basic interface described in d3-force, additionally implementing the following:

# ellipseCollide.initialize(nodes)

Assigns the array of nodes to this force. This method is called when a force is bound to a simulation via simulation.force and when the simulation’s nodes change via simulation.nodes. A force may perform necessary work during initialization, such as evaluating per-node parameters, to avoid repeatedly performing work during each application of the force.

# ellipseCollide.radius([radius])

If radius is specified, sets the radius accessor to the specified two-element array [rx, ry] or function, re-evaluates the radius accessor for each node, and returns this force. If radius is not specified, returns the current radius accessor, which is specified in ellipseCollide(radius) function.

The radius accessor is invoked for each node in the simulation, being passed the node, its zero-based index, and the array of all nodes (the standard D3 format of (d, i, nodes)). The resulting [rx, ry] is then stored internally.

# ellipseCollide.strength([strength])

If strength is specified, sets the force strength to the specified number in the range [0,1] and returns this force. If strength is not specified, returns the current strength, which defaults to 0.1.

*Not yet implemented

Building and testing

Install nvm and npm if you haven't already.

Build with the following commands:

nvm use
npm install
npm run dist

Test with npm run test.

About

An ellipse collision detection constraint for D3 forceSimulation.

Topics

Resources

License

Stars

Watchers

Forks

Packages

 
 
 

Contributors