一个小需求的总结

其实很久之前就想总结下这个需求了，但是一直懒得去组织语言，就一直没动手，放假了没事干，今天想到了就组织下语言总结下吧。

这个需求其实剥离了所有的业务就是知道两个点，然后这两个点之间连了一条线，然后我有一个元素，可以在这条线上移动，但是不能超出线。

一开始我的想法是找拐点，在同一个平面内有两个点，那么这两个点连接的线最多也只有五条线，那么我们找到所有的拐角，然后让这些拐角里可以左右和上下都移动，然后再别的地方就只能上移或者下移，然后通过这种方案做出来最初版，但是结果下来很多问题：

• 用户体验不好，只能在鼠标在元素上的时候能生效，然后就是拐弯的时候很难操作，容易出现拐弯拐不过去的情况
• 有bug，假如一个拐点和不想邻的线坐标一样就会导致在这里也能拐弯，就很很奇怪，

这些我差不多用两天半的样子，搞出个最初版。

但是很明显，这个不太行，领导说这个不行，即使能修复掉这个bug，用户体验也太差了。

后来有一个方案是吸附方案，就是光标在哪里元素就在哪里，当鼠标松开的时候自己跳到最近的线上，这样用户体验也还不错。

不过最后我们去找到了网上类似的需求的实现方案，那个方案就是不要去想拐点问题，去计算光标和线的距离，光标离那根线最近就在那条线上移动，最终我们也是用到了这个方案。

这个方案的难点就在于去计算距离，其实说白了就是个小学几何的问题，但是写在代码里居然这么难，其实每条线，两个点的坐标，拐点的坐标都是知道的，但是如何找到距离呢？那就是找到光标的坐标，然后找到每条线，我们有拐点的坐标，那么就能知道那条线是竖直的，那条线是水平的（我们只有水平和竖直的线），之后再去计算距离就可以了。距离怎么算呢，那就是 $$ x^2 + y^2 $$ 看看谁的距离最大就用谁喽，当然，我这里只是说了几句话，这个需求后半段我仍然用了三天多的时间去搞，最终搞出来了。

然而这个需求本来说的时间去两天。当然，这个需求给我的时候就说了，两天可能不够，你先看着做，但是我没想到最终这个需求写了一个多星期。

然而这个需求的代码加起来还不到200行，所以很多时候代码数量和工作量是不一定匹配的，有可能写了很多代码，但是其实大部分是体力活，不需要特别多的脑力活动，但是有的时候短短的几行代码可能需要好几天的工作量。就比如很多leetcode的一些代码，一般来说不超过20行，但是想要彻底理解可能需要好几天的时间。