Javascript 创建符合坐标列表中的一组规范的线/条的算法/公式

Javascript 创建符合坐标列表中的一组规范的线/条的算法/公式,javascript,svg,angle,Javascript,Svg,Angle,目前我遇到了一个问题,我相信在我之前,有人已经面临并可能已经解决了这个问题。可悲的是,我不知道该怎么称呼这个问题,也不知道该用什么关键词来搜索它。到目前为止,我的研究没有成功 如果你能给我指出正确的方向,或者帮我找到一个比我目前认为过于复杂的解决方案更简单的解决方案,我将不胜感激 语言:Javascript 对象:SVG对象 任务: 给出了一个坐标数组,表示数据点和宽度。我的目标是在所有点上具有给定宽度的点之间生成线。另外,我必须能够在中间分割线,直到相邻点。对于小于3或4像素的宽度,我可以通过

目前我遇到了一个问题,我相信在我之前,有人已经面临并可能已经解决了这个问题。可悲的是,我不知道该怎么称呼这个问题,也不知道该用什么关键词来搜索它。到目前为止,我的研究没有成功

如果你能给我指出正确的方向,或者帮我找到一个比我目前认为过于复杂的解决方案更简单的解决方案,我将不胜感激

语言:Javascript 对象:SVG对象

任务:

给出了一个坐标数组,表示数据点和宽度。我的目标是在所有点上具有给定宽度的点之间生成线。另外,我必须能够在中间分割线,直到相邻点。对于小于3或4像素的宽度,我可以通过简单使用多段线轻松实现这一点。但是,如果宽度变大,多段线将产生越来越大的误差

-蓝色小点表示原始坐标

错误在于svg多段线将自身延伸到坐标上以生成角点的尖端。通过这种方式,信息的精确表示变得错误。我的目标是重新计算坐标,以便此扩展的角点尖端正好位于给定坐标上(1像素公差)

如果更简单的话,也可以用多边形替换直线,或者通过多个fomrs构建直线

最后,结果应该看起来很像但很充实,而不仅仅是一个轮廓。 现在,请参阅以下说明:

  • 起点和终点位于直线的中间(点1和5)
  • 小于90度的角度(点2和点3)表示尖端od和最终尖端(内角)
  • 大于90度的点(点4)应位于角度的平分线上
目前,我的解决方案是基于几何学,从我知道的值中获取角度,然后计算新的点,但它已经非常复杂,我只是担心需要很长时间才能达到我所需要的精确程度

我认为像photoshop或其他矢量工具这样的程序能够做一些类似于我的情况的事情,但是由于我不知道这个问题/algorihtm是如何被称为的,我还没有找到很多有用的信息

提前非常感谢各位

请查看有关直线段之间交点快速计算的算法

否则,我会寻找像或这样的向量库,看看它们是否有您可以使用的内容


最后的想法:根据您给出的示例,我猜想您会发现路径元素是最简单的解决方案。此外,你还担心天真计算的速度,但我认为,除非你处理成千上万的点,否则当你尝试时,你会感到惊讶

对不起,如果不清楚的话,我不是要你给我代码,我是想了解关于这种算法/问题的信息。由于我不知道这个问题叫什么,或者如果有人知道,一个想法(同样不是在代码中)如何自己计算,我理解不知道搜索什么术语的问题。我也不知道这个问题是否有一个特定的术语,但我会先搜索相交算法,特别是对象集/线集的相交。