How to move the center of a radial force in d3.js?

55 Views Asked by At

Created this radial force example: https://observablehq.com/d/808db2d46a9da691 to experiment changing the center point of the radial circle.

According to the docs, the 2nd and 3rd argument accepts x and y:

d3.forceRadial(radius[, x][, y]) 

I do not get that done however: I expect that moving the center of the radial force moves the points that land on the circle with the default center at x=0, y=0.

enter image description here

After moving the center, the points are no longer nicely aligned on the circle but land so:

enter image description here

var simulation = d3.forceSimulation(nodes)
    .force("charge", d3.forceCollide().radius(5))
    .force("r", d3.forceRadial(100, 50, 40)) // << change x and/or y here
    .on("tick", ticked);

Why does changing the x,y center of the radial force not simply move the nodes? (the only other force is the colliding one, so no other point or area attracts the nodes)

0

There are 0 best solutions below