npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

d3-force-magnetic

v1.0.1

Published

A natural attraction/repulsion force type for the d3-force simulation engine.

Downloads

164

Readme

d3.forceMagnetic

NPM package Build Size NPM Downloads

An attraction/repulsion force type for the d3-force simulation engine. By default, it follows the inverse-square law (force intensity inversely proportional to the square of the distance), making it suitable for modelling natural occurring forces like gravity, electrostatic or magnetic. This force can be applied system-wide to a group of nodes (using a Barnes-Hut approximation for performance improvement) in which each node affects and is affected by every other node, or alternatively as a collection of specific links pairing two nodes together, with a dedicated intensity.

The intensity of the force between two nodes is determined by the distance between them (D), the charge of the opposite node (C), the strength of the link (L) and the simulation alpha (A), using the following formula: ACL/D^2.

In the case of a full-mesh group of nodes, the strength of the links is equal for all node pairs, rendering L a system constant. When modelling gravity this would be your gravitational constant G (and C each node's mass), while in an electrostatic system it would represent the Coulomb's law constant k (and C each node's electrical charge).

Node charges (C) can be positive or negative. Positive means that this node will attract other nodes with the specified intensity, while a negative charge represents a repelling force towards other nodes. Keep in mind that, unlike electrical charge, two positive charges do not repel each other, and two opposite charges do not mutually attract each other, a node's charge sign merely represents the effect it has on other nodes. This behavior can however be modified using the polarity method to follow the attraction-of-opposites or any other attraction logic.

As example, this force can be used to simulate accretion between particles, or to model orbits of celestial bodies.

This force plugin is also compatible with d3-force-3d and can function in a one, two (default) or three dimensional space.

Quick start

import d3ForceMagnetic from 'd3-force-magnetic';

or using a script tag

<script src="//unpkg.com/d3-force-magnetic"></script>

then

d3.forceSimulation()
    .nodes(<myNodes>)
    .force('magnetic', d3.forceMagnetic()
        .strength(0.8)   
    );

API reference

| Method | Description | Default | | ------------------ | -------------------------------------------------------------------------------------------------------------------------- | ------------- | | links([array]) | Getter/setter for the list of links connecting nodes. Setting this value will override the default mode of full-mesh of nodes. Each link should follow the syntax: {source: <node id>, target: <node id>}. | (full-mesh) | | id([fn]) | Getter/setter for the node object unique id accessor function, used by links to reference nodes. | node.index | | charge([num or fn]) | Getter/setter for the node object charge accessor function (fn(node)) or a constant (num) for all nodes. A node's charge dictates how other nodes are influenced by it, either by attraction (positive charge) or repulsion (negative charge). | 100 | | strength([num or fn]) | Getter/setter for the link object strength accessor function (fn(link)) or a constant (num) for all node pairs. A link's strength determines how strongly the attractive or repellent force between two nodes is applied to them, or in other words, the capacity of the medium to propagate that mutual force, either by dampening or amplifying. A value of 1 represents unity, while a 0 means no force interaction. | 1 | | polarity([boolean or fn]) | Getter/setter for the acceleration polarity function (fn(charge1, charge2)) or a constant (boolean) for all node pairs. A link acceleration polarity determines whether two given nodes should attract (true) or repel (false) each other, based on their charges. This can be used f.e. to encode an attraction-of-opposites mode, typical of electrical charges, as (q1,q2)=>q1*q2<0. If this method returns null, the attraction logic will be left to the assymetrical charge signs of the individual nodes. | null | | distanceWeight([fn]) | Getter/setter for the distance relationship function (fn(distance)). This method defines how the absolute distance (positive int) between two nodes influences the intensity of the attraction force between them. | d=>1/(d*d) (inverse-square) | | theta([number]) | Getter/setter for the Barnes-Hut approximation θ threshold value. This parameter is only applicable when using the full-mesh mode. It determines the threshold of how far the node needs to be from a particular quadtree region, relative to the region's width, in order for the approximation to be used, and therefore the accuracy of the force calculation. Longer distances (lower θs) will yield more accurate results, at the cost of performance. | 0.9 |

Giving Back

paypal If this project has helped you and you'd like to contribute back, you can always buy me a ☕!