javascript - 重新排列彼此距离过近的点

我的情况是，我在静态 map 图像上动态放置了一堆图标，每个图标都是由CSS绝对定位的。现在经常发生两个或两个以上的点彼此之间太近的情况，因此图标重叠并且不再可区分。

我正在寻找一种算法来找到这些“彼此太靠近”的点，然后以不再相互重叠的方式散布其图标。

我正在考虑放射状展开，例如找到所有太近点的平均中间点，然后相对于该点展开它们。

您可能知道这种问题的任何模式吗？

非常感谢。

最佳答案

以下是一些可以解决您的问题的解决方案:

使用closest pair of points problem的解决方案来查找彼此最接近的两个图标。如果最接近的一对根据您的定义“太近”，则可以将它们彼此分开并重复此过程。

使用空间数据结构(例如k-d树或R树)来存储所有点。然后，您可以执行快速的最近邻居搜索，以找到彼此接近的点并将它们分开。

使用force-directed layout algorithm查找全局最小化某些能量函数的点的布局。像Fruchterman-Reingold这样的算法非常容易编写代码并产生良好的结果。

希望这可以帮助!

关于javascript - 重新排列彼此距离过近的点，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/19407578/