How are overlaps avoided?

[kevin-krug]

first of all thank you for open sourcing your code used for your tech radar.

this is not a issue, but a question on tech radar.js :

how are overlaps between data points on the tech radar avoided?

the custom random function ensures distinct values, however I can't find any code taking the radii of the points into account, to avoid a randomized (x,y) point being within the circle of another point, so that the cartesian diff (Math.sqrt(Math.pow(pointA.x - pointB.x, 2) + Math.pow(pointA.y - pointB.y, 2),)) is always greater 2 * r (r being the dot radius).

thank you for any pointers

[kevin-krug]

I checked out the code, I see, you're using d3 force simulation / a force directed graph to avoid the overlaps, so I'll look into that 👀 , thanks again for open sourcing your code! (I first was expecting overlap would be checked on assigning a new random point within its segment)

  d3.forceSimulation()
    .nodes(config.entries)
    .velocityDecay(0.19) // magic number (found by experimentation)
    .force("collision", d3.forceCollide().radius(12).strength(0.85))
    .on("tick", ticked);

[bocytko]

Closing as you seem to have answered your own question.