d3-force icon indicating copy to clipboard operation
d3-force copied to clipboard

Suggestion: add an angle property to d3.forceRadial() to define the forces in this angle

Open logomanwolf opened this issue 6 years ago • 6 comments

It's a ground truth that in Polar coordinate system we need (angle,radius) to determine a position of a point. When I use d3.forceRadial to add a radial force on nodes, I surmise it could be more applicable if an angle() function is added to d3.forceRadial to define a force on an angle of radial. I thought it derives naturally without which we need to use d3.lineRadial to tranform this problem to what d3.forceCenter can solve. For example, I want to draw a graph as the following. image Each circle in the graph needs to be positioned just at the cover of an arc as if an magnet force existed.

logomanwolf avatar Nov 07 '19 07:11 logomanwolf

Nice idea. See https://observablehq.com/@fil/forceangular for an implementation.

Fil avatar Nov 08 '19 08:11 Fil

Thank you for your reply. Actually, I've learned a lot from your coding.

logomanwolf avatar Nov 08 '19 12:11 logomanwolf

New iteration of the code. The things that I was not happy with in the first iteration were:

  1. the force did not have the correct dimension (should have been in pixels per iteration) ; it's fixed now by multiplying the tangent vector by the distance to the center.

  2. points that were almost at the opposite of their target angle were boosted too much, resulting in spectacular (but wrong) movements; fixed by using hypot(1, tan(diff/2)) instead of 1+tan^2.

In both cases the result is mathematically justified, so I think the code is final. I don't know if it should be included in d3-force or not.

If it is included, and we want to modify d3.forceRadial to take into account the angle, there's a difficulty with the order of arguments: forceRadial(r, x, y) can't be easily expanded to forceRadial(r, a, x, y).

However we could define forcePolar(r, a, x, y), and make syntactic sugar for forceRadial(r, x, y) and forceAngular(a, x, y).

Fil avatar Nov 09 '19 12:11 Fil

I think these new forces are very useful for various scenarios. Thanks for putting them together @Fil!

In case they don't make it to d3-force would be nice to have them available as NPM modules for ease of reuse. We can also list them on d3-force-registry.

vasturiano avatar Nov 09 '19 22:11 vasturiano

I've mixed them into forcePolar https://observablehq.com/@fil/forcepolar with syntactic sugar for forceRadial and forceAngular

Fil avatar Nov 10 '19 16:11 Fil

Related: https://github.com/d3/d3-force/pull/113

Fil avatar Jun 25 '20 18:06 Fil