Skip to content

vasturiano/d3-force-elastic

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

13 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

d3.forceElastic

NPM package Build Size NPM Downloads

A spring-like force type that attracts nodes when their link is extended beyond its length at rest. The force intensity follows Hooke's law and is proportional to the extension distance. For distances less than the link's length, by default no force is applied, but a compressionFactor can be applied to add a repelling force.

The intensity of the attraction force between two nodes is determined by the extension distance (D), the elasticity of the link (E) and the simulation alpha (A), using the following formula: A*E*D. In compressed state this is further multiplied by the compressionFactor, resulting in a repelling force.

This force plugin is designed to be used with the d3-force simulation engine. It is also compatible with d3-force-3d and can function in a one, two (default) or three-dimensional space.

Quick start

import d3ForceElastic from 'd3-force-elastic';

or using a script tag

<script src="//cdn.jsdelivr.net/npm/d3-force-elastic"></script>

then

d3.forceSimulation()
  .nodes(<myNodes>)
  .force('elastic', d3.forceElastic()
    .links(<myLinks>)
    .elasticity(0.8)   
  );

API reference

Method Description Default
links([array]) Getter/setter for the list of links connecting nodes. Each link should follow the syntax: {source: <node-id or node-object>, target: <node-id or node-object>}. []
id([fn]) Getter/setter for the node object unique id accessor function, used by links to reference nodes. node.index
distance([num or fn]) Getter/setter for the link distance accessor function (fn(link)) or a constant (num) for all links. A link's distance determines the natural length of the spring at rest (not extended), after which an attraction force will be applied. 30
elasticity([num or fn]) Getter/setter for the link elasticity accessor function (fn(link)) or a constant (num) for all links. A link's elasticity determines the stiffness of the extending spring and how strongly the attractive force between two nodes is applied to them. A value of 1 represents unity, while a 0 means no force interaction. 0.8
compressionFactor([num or fn]) Getter/setter for the link compression factor accessor function (fn(link)) or a constant (num) for all links. A link's compression factor determines how much push back is applied to the nodes when the spring is in compressed state. This value is a multiplier of the link's elasticity and determines the intensity of the repelling force on compressed links. A value of 1 means the repelling force is as strong as the elastic attraction force, while a 0 means no push back. 0

❤️ Support This Project

If you find this module useful and would like to support its development, you can buy me a ☕. Your contributions help keep open-source sustainable! paypal

About

A Hooke's law spring-like attraction force between node pairs for the d3-force simulation engine

Topics

Resources

License

Stars

Watchers

Forks