请大家积极参与，给我一个免费的Star吧！如果发现了Bug，欢迎来提Issue哟~ 源码链接在github和gitee上，示例地址请点击这里。
在项目进入第10章的时候，感觉接近制作尾声了…
本文将探讨对齐线和磁贴功能的具体实现，重点解释了互动的两个部分：节点之间的对齐线和对齐磁贴。在多个选择的情况下，呈现相同的效果。
相关的核心逻辑代码会存在于“选择”的代码文件中：src\Render\handlers\SelectionHandlers.ts
在这篇文章中，我将逐步详细解释其中的关键逻辑，并附上相关的图示和代码片段。如果您对这个功能感兴趣的话，请不妨往下看。
精心准备了一个图以横向（基于x坐标值）为例进行解释：
在该图中的x1~x9，代表SortItem。横向（基于y坐标值）同理。需要特别指出的是，如果是正在拖动的目标节点，会在SortItem中记录该节点的_id以示区分。
在查找所有SortItemPair的同时，只会更新并记录节点间距离最短的那些SortItemPair（可能会存在多个）。
以上是核心逻辑代码的示例图示。虽然代码冗长，但逻辑相对依然较为清晰。一旦找到满足条件的SortItemPair（小于阈值，即足够接近），可以根据记录的坐标值大小，定义并绘制相应的线条并添加到layerCover中。
正如示例图所示，代码的逻辑相对比较清晰。找到满足条件（小于阈值，足够近，这里阈值为背景网格的一半大小）的SortItemPair，就可以根据记录的坐标值大小，定义并绘制相应的线条（添加到layerCover中），并在合适的时候执行alignLinesClear清空失效的对齐线即可。
接下来，我们计划实现下面这些功能：连接线、等等
- 连接线
- 等等…
如果您对这个功能感兴趣的话，更多的Star和鼓励将是对我们最大的支持~
源码链接在github和gitee上，示例地址请点击这里。
