SVG路径上的Catmull-Rom插值

我正在尝试使用SVG路径创建高性能、好看的铅笔工具

我正在记录鼠标坐标以绘制路径。为了获得高保真的路径（精确到用户的移动），我需要为每个像素移动记录一个点

保持路径中的每一个点都会创建大量的点，这对于以后的协作功能来说并不理想（来回发送大量的点是没有效率的），再加上每次我需要操纵巨大的路径时解析它们是一个瓶颈

在路径的线性区域上，冗余点被删除，只保留表示线段所需的点-我使用算法来实现这一点

但是简化一条路径会使它变成一个低保真度的多边形 在这一点上，路径实际上只是连接线-因此路径看起来参差不齐

一个可能的解决方案是将路径点与三次贝塞尔曲线连接起来，但这在简化的路径上效果不佳。每个点之间的距离太大，立方贝塞尔无法“坐”好，因此平滑的路径不再准确地表示用户的预期路径

另一个解决方案是简单地使用“后处理”算法，比如在原始路径上——尽管该算法实际上不会实时工作，因为它是一个性能问题

理想溶液 （我认为）可行的解决方案是使用插值

在我研究的所有算法中，这似乎是最有希望的，因为：

它不会在狭窄的拐角处创建自相交

它更贴合点，因此更准确地表示 原始路径

---

Catmull Rom是一种插值一系列数据的算法吗 常规x/y点或原始路径是否需要由

---

曲线？

我为此使用插值立方体

上的采样点

• 鼠标方向在任意轴上改变
• 如果鼠标移动了一些距离以获得更高的精度，可以添加：如果方向角度变化太大（我不使用此选项）
• 如果鼠标停止（如果您也使用上/下鼠标，则可以忽略此选项）

使用采样点作为插值立方的控制点

你也可以在这里找到插值和贝塞尔立方之间的转换

如果这还不够，您可以用相同的方向连接线

以下是以这种方式绘制的手绘示例：

以及SVG：

<svg width="512" height="512" viewBox="-131.734968 -63.890725 383.802249 203.65153" >
 <path fill="none" stroke="black" stroke-width="1px" data-tool="-1" data-cfg="-1" data-group="-1" data-hair="0" data-dir="0" transform="matrix(1,0,0,1,0,0" d="M -81.842337 36.317509 c 0 0 -0.494188 0.282842 0 0 c 0 0 4.1653 -2.262737 4.447693 -2.545579 c 0.494188 -0.282842 2.188547 -2.262737 2.541539 -2.545579 c 0.282393 -0.282842 2.823932 -2.192026 3.176923 -2.545579 c 0.352991 -0.282842 2.965128 -2.828421 3.176923 -3.181974 c 0.352991 -0.353552 1.623761 -2.899132 1.906154 -3.181974 c 0.211794 -0.353552 2.329744 -2.192026 2.541539 -2.545579 c 0.282393 -0.282842 1.623761 -2.969842 1.906154 -3.181974 c 0.211794 -0.353552 2.400342 -1.697053 2.541539 -1.909184 c 0.282393 -0.212131 0.988376 -1.626342 1.270769 -1.909184 c 0.141196 -0.212131 2.329744 -2.333447 2.541539 -2.545579 c 0.282393 -0.282842 1.411966 -1.626342 1.906154 -1.909184 c 0.211794 -0.212131 3.953505 -2.474869 4.447693 -2.545579 c 0.494188 -0.282842 4.024103 -0.565684 4.447693 -0.636394 c 0.494188 -0.07071 3.247522 -0.494973 3.812308 -0.636394 c 0.423589 -0.07071 4.730086 -1.272789 5.083078 -1.272789 c 0.564786 -0.141421 2.823932 0 3.176923 0 c 0.352991 0 2.823932 0 3.176923 0 c 0.352991 0 2.753333 0 3.176923 0 c 0.352991 0 3.31812 -0.212131 3.812308 0 c 0.423589 0 4.024103 1.626342 4.447693 1.909184 c 0.494188 0.212131 3.459317 2.192026 3.812308 2.545579 c 0.423589 0.282842 2.965128 2.828421 3.176923 3.181974 c 0.352991 0.353552 1.764957 2.61629 1.906154 3.181974 c 0.211794 0.353552 1.270769 4.454764 1.270769 5.091159 c 0.141196 0.565684 0 5.23258 0 5.727554 c 0 0.636394 0 3.889079 0 4.454764 c 0 0.494973 -0.070598 4.596185 0 5.091159 c 0 0.565684 0.423589 4.101211 0.635384 4.454764 c 0.070598 0.494973 1.623761 2.899132 1.906154 3.181974 c 0.211794 0.353552 1.976752 2.474869 2.541539 2.545579 c 0.282393 0.282842 4.730086 0.636394 5.083078 0.636394 c 0.564786 0.07071 2.753333 0 3.176923 0 c 0.352991 0 3.529915 0 3.812308 0 c 0.423589 0 2.04735 0 2.541539 0 c 0.282393 0 4.024103 0 4.447693 0 c 0.494188 0 3.459317 0.07071 3.812308 0 c 0.423589 0 2.89453 -0.565684 3.176923 -0.636394 c 0.352991 -0.07071 2.04735 -0.353552 2.541539 -0.636394 c 0.282393 -0.07071 4.235898 -2.404158 4.447693 -2.545579 c 0.494188 -0.282842 1.482564 -0.989947 1.906154 -1.272789 c 0.211794 -0.141421 3.600513 -2.262737 3.812308 -2.545579 c 0.423589 -0.282842 1.694359 -2.262737 1.906154 -2.545579 c 0.211794 -0.282842 1.623761 -2.192026 1.906154 -2.545579 c 0.211794 -0.282842 2.329744 -2.969842 2.541539 -3.181974 c 0.282393 -0.353552 1.553162 -1.555631 1.906154 -1.909184 c 0.211794 -0.212131 2.823932 -2.899132 3.176923 -3.181974 c 0.352991 -0.353552 2.823932 -2.333447 3.176923 -2.545579 c 0.352991 -0.282842 2.753333 -1.697053 3.176923 -1.909184 c 0.352991 -0.212131 3.459317 -1.838474 3.812308 -1.909184 c 0.423589 -0.212131 2.823932 -0.565684 3.176923 -0.636394 c 0.352991 -0.07071 2.823932 -0.636394 3.176923 -0.636394 c 0.352991 -0.07071 2.823932 0 3.176923 0 c 0.352991 0 2.541539 -0.07071 3.176923 0 c 0.352991 0 5.436069 0.353552 5.718462 0.636394 c 0.635384 0.07071 2.400342 2.050605 2.541539 2.545579 c 0.282393 0.282842 1.058974 4.030501 1.270769 4.454764 c 0.141196 0.494973 1.835555 3.394106 1.906154 3.818369 c 0.211794 0.424263 0.423589 3.323395 0.635384 3.818369 c 0.070598 0.424263 1.553162 3.95979 1.906154 4.454764 c 0.211794 0.494973 2.753333 4.313343 3.176923 4.454764 c 0.352991 0.494973 3.459317 1.131368 3.812308 1.272789 c 0.423589 0.141421 2.823932 1.202079 3.176923 1.272789 c 0.352991 0.141421 2.682735 0.636394 3.176923 0.636394 c 0.352991 0.07071 3.74171 0 4.447693 0 c 0.494188 0 6.000856 0 6.353847 0 c 0.705983 0 2.753333 0 3.176923 0 c 0.352991 0 3.459317 0.07071 3.812308 0 c 0.423589 0 2.682735 -0.424263 3.176923 -0.636394 c 0.352991 -0.07071 4.1653 -1.697053 4.447693 -1.909184 c 0.494188 -0.212131 2.259145 -1.697053 2.541539 -1.909184 c 0.282393 -0.212131 2.04735 -1.697053 2.541539 -1.909184 c 0.282393 -0.212131 4.235898 -1.626342 4.447693 -1.909184 c 0.494188 -0.212131 1.553162 -2.333447 1.906154 -2.545579 c 0.211794 -0.282842 2.753333 -1.697053 3.176923 -1.909184 c 0.352991 -0.212131 3.529915 -1.767763 3.812308 -1.909184 c 0.423589 -0.212131 2.04735 -1.202079 2.541539 -1.272789 c 0.282393 -0.141421 4.094701 -0.636394 4.447693 -0.636394 c 0.494188 -0.07071 2.823932 0 3.176923 0 c 0.352991 0 2.823932 0 3.176923 0 c 0.352991 0 2.753333 0 3.176923 0 c 0.352991 0 3.388718 -0.212131 3.812308 0 c 0.423589 0 3.388718 1.767763 3.812308 1.909184 c 0.423589 0.212131 3.459317 0.919237 3.812308 1.272789 c 0.423589 0.141421 2.965128 2.969842 3.176923 3.181974 c 0.352991 0.353552 1.764957 1.555631 1.906154 1.909184 c 0.211794 0.212131 1.058974 2.899132 1.270769 3.181974 c 0.141196 0.353552 1.835555 2.192026 1.906154 2.545579 c 0.211794 0.282842 0.352991 2.828421 0.635384 3.181974 c 0.070598 0.353552 2.259145 2.899132 2.541539 3.181974 c 0.282393 0.353552 2.117949 2.474869 2.541539 2.545579 c 0.282393 0.282842 3.459317 0.565684 3.812308 0.636394 c 0.423589 0.07071 2.823932 0.636394 3.176923 0.636394 c 0.352991 0.07071 2.823932 -0.07071 3.176923 0 c 0.352991 0 2.753333 0.565684 3.176923 0.636394 c 0.352991 0.07071 3.459317 0.636394 3.812308 0.636394 c 0.423589 0.07071 2.823932 0 3.176923 0 c 0.352991 0 2.682735 0.07071 3.176923 0 c 0.352991 0 4.1653 -0.636394 4.447693 -0.636394 c 0.494188 -0.07071 2.188547 0.212131 2.541539 0 c 0.282393 0 2.682735 -1.697053 3.176923 -1.909184 c 0.352991 -0.212131 4.235898 -1.767763 4.447693 -1.909184 c 0.494188 -0.212131 1.623761 -1.131368 1.906154 -1.272789 c 0.211794 -0.141421 2.329744 -1.060658 2.541539 -1.272789 c 0.282393 -0.141421 1.906154 -1.909184 1.906154 -1.909184 c 0.211794 -0.212131 0 0 0 0m -334.847767 40.092879 c 0 0 -0.352991 -0.141421 0 0 c 0 0 2.682735 1.131368 3.176923 1.272789 c 0.352991 0.141421 4.1653 1.202079 4.447693 1.272789 c 0.494188 0.141421 2.259145 0.494973 2.541539 0.636394 c 0.282393 0.07071 2.188547 1.202079 2.541539 1.272789 c 0.282393 0.141421 2.823932 0.565684 3.176923 0.636394 c 0.352991 0.07071 2.753333 0.565684 3.176923 0.636394 c 0.352991 0.07071 3.459317 0.636394 3.812308 0.636394 c 0.423589 0.07071 2.823932 0 3.176923 0 c 0.352991 0 2.823932 0 3.176923 0 c 0.352991 0 2.823932 0 3.176923 0 c 0.352991 0 2.89453 0 3.176923 0 c 0.352991 0 2.188547 0 2.541539 0 c 0.282393 0 2.823932 0 3.176923 0 c 0.352991 0 2.753333 0 3.176923 0 c 0.352991 0 3.529915 0.141421 3.812308 0 c 0.423589 0 2.04735 -0.989947 2.541539 -1.272789 c 0.282393 -0.141421 4.1653 -2.262737 4.447693 -2.545579 c 0.494188 -0.282842 2.329744 -2.192026 2.541539 -2.545579 c 0.282393 -0.282842 1.835555 -2.687 1.906154 -3.181974 c 0.211794 -0.353552 0.564786 -3.95979 0.635384 -4.454764 c 0.070598 -0.494973 1.200171 -4.242632 0.635384 -4.454764 c 0.070598 -0.494973 -4.659488 -2.050605 -5.083078 -1.909184 c -0.564786 -0.212131 -3.529915 0.989947 -3.812308 1.272789 c -0.423589 0.141421 -2.188547 1.979895 -2.541539 2.545579 c -0.282393 0.282842 -3.176923 4.525474 -3.176923 5.091159 c -0.352991 0.565684 0 4.525474 0 5.091159 c 0 0.565684 -0.282393 4.808317 0 5.091159 c 0 0.565684 2.259145 2.474869 2.541539 2.545579 c 0.282393 0.282842 2.117949 0.424263 2.541539 0.636394 c 0.282393 0.07071 3.388718 1.838474 3.812308 1.909184 c 0.423589 0.212131 3.247522 0.565684 3.812308 0.636394 c 0.423589 0.07071 4.588889 0.636394 5.083078 0.636394 c 0.564786 0.07071 4.1653 0 4.447693 0 c 0.494188 0 2.04735 0 2.541539 0 c 0.282393 0 3.953505 0 4.447693 0 c 0.494188 0 3.671111 0.212131 4.447693 0 c 0.494188 0 6.565642 -1.838474 6.989232 -1.909184 c 0.776581 -0.212131 3.459317 -0.424263 3.812308 -0.636394 c 0.423589 -0.07071 2.753333 -1.767763 3.176923 -1.909184 c 0.352991 -0.212131 3.459317 -0.989947 3.812308 -1.272789 c 0.423589 -0.141421 2.823932 -2.050605 3.176923 -2.545579 c 0.352991 -0.282842 3.106325 -4.030501 3.176923 -4.454764 c 0.352991 -0.494973 1.058974 -3.676948 0.635384 -3.818369 c 0.070598 -0.424263 -3.388718 -1.484921 -3.812308 -1.272789 c -0.423589 -0.141421 -3.459317 1.697053 -3.812308 1.909184 c -0.423589 0.212131 -2.823932 1.626342 -3.176923 1.909184 c -0.352991 0.212131 -2.89453 2.262737 -3.176923 2.545579 c -0.352991 0.282842 -2.47094 2.050605 -2.541539 2.545579 c -0.282393 0.282842 -0.635384 3.889079 -0.635384 4.454764 c -0.070598 0.494973 -0.282393 4.808317 0 5.091159 c 0 0.565684 2.329744 2.404158 2.541539 2.545579 c 0.282393 0.282842 1.623761 1.131368 1.906154 1.272789 c 0.211794 0.141421 2.259145 1.202079 2.541539 1.272789 c 0.282393 0.141421 1.976752 0.424263 2.541539 0.636394 c 0.282393 0.07071 4.588889 1.909184 5.083078 1.909184 c 0.564786 0.212131 3.882906 -0.07071 4.447693 0 c 0.494188 0 4.800684 0.636394 5.083078 0.636394 c 0.564786 0.07071 2.188547 0 2.541539 0 c 0.282393 0 2.823932 -0.07071 3.176923 0 c 0.352991 0 2.612137 0.636394 3.176923 0.636394 c 0.352991 0.07071 4.730086 0 5.083078 0 c 0.564786 0 2.89453 0 3.176923 0 c 0.352991 0 2.188547 0.07071 2.541539 0 c 0.282393 0 2.753333 -0.494973 3.176923 -0.636394 c 0.352991 -0.07071 3.247522 -0.989947 3.812308 -1.272789 c 0.423589 -0.141421 4.730086 -2.333447 5.083078 -2.545579 c 0.564786 -0.282842 2.89453 -1.555631 3.176923 -1.909184 c 0.352991 -0.212131 2.400342 -2.969842 2.541539 -3.181974 c 0.282393 -0.353552 1.129572 -1.484921 1.270769 -1.909184 c 0.141196 -0.212131 1.270769 -3.394106 1.270769 -3.818369 c 0.141196 -0.424263 0 -3.394106 0 -3.818369 c 0 -0.424263 0.352991 -3.606237 0 -3.818369 c 0 -0.424263 -2.682735 -1.909184 -3.176923 -1.909184 c -0.352991 -0.212131 -4.024103 -0.07071 -4.447693 0 c -0.494188 0 -3.671111 0.353552 -3.812308 0.636394 c -0.423589 0.07071 -1.200171 1.979895 -1.270769 2.545579 c -0.141196 0.282842 -0.705983 4.525474 -0.635384 5.091159 c -0.070598 0.565684 0.352991 4.666895 0.635384 5.091159 c 0.070598 0.565684 2.259145 3.535527 2.541539 3.818369 c 0.282393 0.424263 2.259145 2.333447 2.541539 2.545579 c 0.282393 0.282842 2.04735 1.626342 2.541539 1.909184 c 0.282393 0.212131 3.882906 2.333447 4.447693 2.545579 c 0.494188 0.282842 4.800684 1.909184 5.083078 1.909184 c 0.564786 0.212131 2.188547 -0.212131 2.541539 0 c 0.282393 0 2.89453 1.909184 3.176923 1.909184 c 0.352991 0.212131 2.04735 -0.141421 2.541539 0 c 0.282393 0 4.024103 1.131368 4.447693 1.272789 c 0.494188 0.141421 3.247522 1.272789 3.812308 1.272789 c 0.423589 0.141421 4.800684 0 5.083078 0 c 0.564786 0 2.188547 0 2.541539 0 c 0.282393 0 2.823932 0 3.176923 0 c 0.352991 0 2.823932 0 3.176923 0 c 0.352991 0 2.682735 0 3.176923 0 c 0.352991 0 4.1653 0 4.447693 0 c 0.494188 0 2.188547 0.07071 2.541539 0 c 0.282393 0 2.823932 -0.565684 3.176923 -0.636394 c 0.352991 -0.07071 2.823932 -0.424263 3.176923 -0.636394 c 0.352991 -0.07071 2.612137 -1.626342 3.176923 -1.909184 c 0.352991 -0.212131 4.800684 -2.333447 5.083078 -2.545579 c 0.564786 -0.282842 2.188547 -1.626342 2.541539 -1.909184 c 0.282393 -0.212131 2.89453 -2.262737 3.176923 -2.545579 c 0.352991 -0.282842 2.329744 -2.192026 2.541539 -2.545579 c 0.282393 -0.282842 1.764957 -2.61629 1.906154 -3.181974 c 0.211794 -0.353552 1.270769 -4.384053 1.270769 -5.091159 c 0.141196 -0.565684 0.635384 -6.222527 0 -6.363949 c 0 -0.707105 -5.294872 -1.202079 -5.718462 -1.272789 c -0.635384 -0.141421 -3.31812 -0.636394 -3.812308 -0.636394 c -0.423589 -0.07071 -4.094701 -0.353552 -4.447693 0 c -0.494188 0 -3.176923 2.61629 -3.176923 3.181974 c -0.352991 0.353552 0 4.525474 0 5.091159 c 0 0.565684 -0.211794 4.525474 0 5.091159 c 0 0.565684 1.694359 4.949738 1.906154 5.091159 c 0.211794 0.565684 1.694359 1.060658 1.906154 1.272789 c 0.211794 0.141421 1.694359 1.767763 1.906154 1.909184 c 0.211794 0.212131 1.694359 1.131368 1.906154 1.272789 c 0.211794 0.141421 1.553162 0.989947 1.906154 1.272789 c 0.211794 0.141421 2.89453 2.404158 3.176923 2.545579 c 0.352991 0.282842 2.259145 1.202079 2.541539 1.272789 c 0.282393 0.141421 2.259145 0.494973 2.541539 0.636394 c 0.282393 0.07071 2.117949 1.131368 2.541539 1.272789 c 0.282393 0.141421 3.388718 1.202079 3.812308 1.272789 c 0.423589 0.141421 3.459317 0.494973 3.812308 0.636394 c 0.423589 0.07071 2.823932 1.272789 3.176923 1.272789 c 0.352991 0.141421 2.89453 0 3.176923 0 c 0.352991 0 2.188547 0 2.541539 0 c 0.282393 0 2.823932 0 3.176923 0 c 0.352991 0 2.823932 0 3.176923 0 c 0.352991 0 2.89453 0 3.176923 0 c 0.352991 0 2.188547 0 2.541539 0 c 0.282393 0 2.753333 0.07071 3.176923 0 c 0.352991 0 3.388718 -0.494973 3.812308 -0.636394 c 0.423589 -0.07071 3.388718 -0.919237 3.812308 -1.272789 c 0.423589 -0.141421 3.600513 -2.61629 3.812308 -3.181974 c 0.423589 -0.353552 1.835555 -4.596185 1.906154 -5.091159 c 0.211794 -0.565684 0.635384 -3.889079 0.635384 -4.454764 c 0.070598 -0.494973 0.211794 -4.525474 0 -5.091159 c 0 -0.565684 -1.553162 -4.879027 -1.906154 -5.091159 c -0.211794 -0.565684 -2.47094 -1.979895 -3.176923 -1.909184 c -0.352991 -0.212131 -6.142052 0.353552 -6.353847 0.636394 c -0.705983 0.07071 -1.694359 2.192026 -1.906154 2.545579 c -0.211794 0.282842 -1.835555 2.757711 -1.906154 3.181974 c -0.211794 0.353552 -0.564786 3.323395 -0.635384 3.818369 c -0.070598 0.424263 -0.776581 4.030501 -0.635384 4.454764 c -0.070598 0.494973 1.058974 3.535527 1.270769 3.818369 c 0.141196 0.424263 1.482564 2.333447 1.906154 2.545579 c 0.211794 0.282842 3.600513 1.767763 3.812308 1.909184 c 0.423589 0.212131 1.482564 1.131368 1.906154 1.272789 c 0.211794 0.141421 3.31812 1.131368 3.812308 1.272789 c 0.423589 0.141421 4.024103 1.202079 4.447693 1.272789 c 0.494188 0.141421 3.459317 0.636394 3.812308 0.636394 c 0.423589 0.07071 2.682735 0 3.176923 0 c 0.352991 0 4.094701 0 4.447693 0 c 0.494188 0 2.89453 0 3.176923 0 c 0.352991 0 2.117949 0 2.541539 0 c 0.282393 0 3.459317 0 3.812308 0 c 0.423589 0 2.89453 0.141421 3.176923 0 c 0.352991 0 2.04735 -1.060658 2.541539 -1.272789 c 0.282393 -0.141421 4.024103 -1.626342 4.447693 -1.909184 c 0.494188 -0.212131 3.600513 -2.333447 3.812308 -2.545579 c 0.423589 -0.282842 1.623761 -1.484921 1.906154 -1.909184 c 0.211794 -0.212131 2.400342 -3.676948 2.541539 -3.818369 c 0.282393 -0.424263 1.270769 -1.272789 1.270769 -1.272789 c 0.141196 -0.141421 0 0 0 0m -261.143135 -114.551083 c 0 0 -0.352991 0.212131 0 0 c 0 0 2.823932 -1.767763 3.176923 -1.909184 c 0.352991 -0.212131 2.89453 -1.202079 3.176923 -1.272789 c 0.352991 -0.141421 2.259145 -0.424263 2.541539 -0.636394 c 0.282393 -0.07071 2.117949 -1.626342 2.541539 -1.909184 c 0.282393 -0.212131 3.600513 -2.262737 3.812308 -2.545579 c 0.423589 -0.282842 1.623761 -2.404158 1.906154 -2.545579 c 0.211794 -0.282842 2.188547 -0.848526 2.541539 -1.272789 c 0.282393 -0.141421 2.89453 -3.464816 3.176923 -3.818369 c 0.352991 -0.424263 2.47094 -2.828421 2.541539 -3.181974 c 0.282393 -0.353552 0.423589 -2.828421 0.635384 -3.181974 c 0.070598 -0.353552 1.764957 -2.969842 1.906154 -3.181974 c 0.211794 -0.353552 1.270769 -2.474869 1.270769 -1.909184 c 0.141196 -0.212131 0 4.737606 0 5.091159 c 0 0.565684 -0.141196 2.828421 0 3.181974 c 0 0.353552 1.129572 2.757711 1.270769 3.181974 c 0.141196 0.353552 1.129572 3.323395 1.270769 3.818369 c 0.141196 0.424263 1.058974 4.030501 1.270769 4.454764 c 0.141196 0.494973 1.553162 3.323395 1.906154 3.818369 c 0.211794 0.424263 2.89453 4.171922 3.176923 4.454764 c 0.352991 0.494973 2.117949 2.404158 2.541539 2.545579 c 0.282393 0.282842 3.459317 1.060658 3.812308 1.272789 c 0.423589 0.141421 2.753333 1.909184 3.176923 1.909184 c 0.352991 0.212131 3.31812 0.212131 3.812308 0 c 0.423589 0 4.235898 -1.767763 4.447693 -1.909184 c 0.494188 -0.212131 1.411966 -0.919237 1.906154 -1.272789 c 0.211794 -0.141421 4.1653 -2.828421 4.447693 -3.181974 c 0.494188 -0.353552 1.976752 -2.687 2.541539 -3.181974 c 0.282393 -0.353552 4.800684 -4.101211 5.083078 -4.454764 c 0.564786 -0.494973 2.400342 -2.899132 2.541539 -3.181974 c 0.282393 -0.353552 1.058974 -2.262737 1.270769 -2.545579 c 0.141196 -0.282842 1.623761 -2.121316 1.906154 -2.545579 c 0.211794 -0.282842 2.259145 -3.323395 2.541539 -3.818369 c 0.282393 -0.424263 2.329744 -4.737606 2.541539 -4.454764 c 0.282393 -0.494973 1.835555 2.192026 1.906154 2.545579 c 0.211794 0.282842 0.564786 2.757711 0.635384 3.181974 c 0.070598 0.353552 0.494188 3.323395 0.635384 3.818369 c 0.070598 0.424263 1.129572 3.95979 1.270769 4.454764 c 0.141196 0.494973 1.058974 3.95979 1.270769 4.454764 c 0.141196 0.494973 1.553162 4.101211 1.906154 4.454764 c 0.211794 0.494973 3.035727 2.969842 3.176923 3.181974 c 0.352991 0.353552 0.776581 1.767763 1.270769 1.909184 c 0.141196 0.212131 3.953505 1.272789 4.447693 1.272789 c 0.494188 0.141421 4.094701 0 4.447693 0 c 0.494188 0 2.753333 0 3.176923 0 c 0.352991 0 3.388718 0.141421 3.812308 0 c 0.423589 0 3.388718 -1.060658 3.812308 -1.272789 c 0.423589 -0.141421 3.529915 -1.555631 3.812308 -1.909184 c 0.423589 -0.212131 2.259145 -2.899132 2.541539 -3.181974 c 0.282393 -0.353552 2.329744 -2.192026 2.541539 -2.545579 c 0.282393 -0.282842 1.764957 -2.828421 1.906154 -3.181974 c 0.211794 -0.353552 1.129572 -2.969842 1.270769 -3.181974 c 0.141196 -0.353552 0.988376 -1.555631 1.270769 -1.909184 c 0.141196 -0.212131 2.188547 -3.040553 2.541539 -3.181974 c 0.282393 -0.353552 3.106325 -1.767763 3.176923 -1.272789 c 0.352991 -0.141421 0.494188 3.95979 0.635384 4.454764 c 0.070598 0.494973 1.200171 4.030501 1.270769 4.454764 c 0.141196 0.494973 0.494188 3.252685 0.635384 3.818369 c 0.070598 0.424263 1.058974 4.666895 1.270769 5.091159 c 0.141196 0.565684 1.694359 3.394106 1.906154 3.818369 c 0.211794 0.424263 1.623761 3.464816 1.906154 3.818369 c 0.211794 0.424263 2.117949 2.899132 2.541539 3.181974 c 0.282393 0.353552 3.388718 2.474869 3.812308 2.545579 c 0.423589 0.282842 3.31812 0.636394 3.812308 0.636394 c 0.423589 0.07071 4.024103 0 4.447693 0 c 0.494188 0 3.31812 0 3.812308 0 c 0.423589 0 4.024103 0.07071 4.447693 0 c 0.494188 0 3.31812 -0.353552 3.812308 -0.636394 c 0.423589 -0.07071 4.024103 -2.262737 4.447693 -2.545579 c 0.494188 -0.282842 3.388718 -2.192026 3.812308 -2.545579 c 0.423589 -0.282842 3.600513 -2.899132 3.812308 -3.181974 c 0.423589 -0.353552 1.623761 -2.333447 1.906154 -2.545579 c 0.211794 -0.282842 2.400342 -1.555631 2.541539 -1.909184 c 0.282393 -0.212131 0.917777 -2.828421 1.270769 -3.181974 c 0.141196 -0.353552 3.035727 -2.757711 3.176923 -3.181974 c 0.352991 -0.353552 0.988376 -3.889079 1.270769 -3.818369 c 0.141196 -0.424263 2.47094 0.282842 2.541539 0.636394 c 0.282393 0.07071 0.635384 2.757711 0.635384 3.181974 c 0.070598 0.353552 -0.070598 3.464816 0 3.818369 c 0 0.424263 0.564786 2.61629 0.635384 3.181974 c 0.070598 0.353552 0.564786 4.666895 0.635384 5.091159 c 0.070598 0.565684 0.494188 3.464816 0.635384 3.818369 c 0.070598 0.424263 0.988376 2.757711 1.270769 3.181974 c 0.141196 0.353552 1.976752 3.818369 2.541539 3.818369 c 0.282393 0.424263 4.800684 0 5.083078 0 c 0.564786 0 2.04735 0 2.541539 0 c 0.282393 0 4.094701 0 4.447693 0 c 0.494188 0 2.753333 0 3.176923 0 c 0.352991 0 3.388718 0.212131 3.812308 0 c 0.423589 0 3.459317 -1.697053 3.812308 -1.909184 c 0.423589 -0.212131 2.823932 -1.555631 3.176923 -1.909184 c 0.352991 -0.212131 2.89453 -2.969842 3.176923 -3.181974 c 0.352991 -0.353552 2.259145 -1.555631 2.541539 -1.909184 c 0.282393 -0.212131 2.259145 -2.899132 2.541539 -3.181974 c 0.282393 -0.353552 2.188547 -2.192026 2.541539 -2.545579 c 0.282393 -0.282842 2.89453 -2.828421 3.176923 -3.181974 c 0.352991 -0.353552 2.47094 -2.899132 2.541539 -3.181974 c 0.282393 -0.353552 0.635384 -2.545579 0.635384 -2.545579 c 0.070598 -0.282842 0 0 0 0 "/>
</svg>

它大约是20KB，如果你玩Treshold，你可以显著降低点数。这是调整，以满足我的需要

以下是绘制过程中鼠标跟随的感觉示例（在绘制过程中实时捕获）

---

要直接回答您的问题：

对。Catmull-Rom样条是一种插值一系列（x，y，z）点的算法。它将在每两个连续点之间生成一条三次多项式曲线。

不能直接将Catmull Rom样条线用于SVG路径。首先需要将其转换为三次贝塞尔曲线

对于由点P0、P1、P2和P3以及节点序列t0、t1、t2、t3定义的曲线段，可通过中提供的递归公式计算向心Catmull-Rom样条曲线（在点P1和P2之间定义）。因此，我不在此详述

要将其转换为三次贝塞尔曲线，需要计算第一个 P1和P2处的导数为

M1 = (t2-t1)*(c1*(P1-P0)/(t1-t0) + c2*(P2-P1)/(t2-t1))
M2 = (t2-t1)*(d1*(P2-P1)/(t2-t1) + d2*(P3-P2)/(t3-t2))

在哪里

 c1 = (t2-t1)/(t2-t0),
 c2 = (t1-t0)/(t2-t0),
 d1 = (t3-t2)/(t3-t1),
 d2 = (t2-t1)/(t3-t1)

然后可以将其转换为具有4个控制点的三次贝塞尔曲线：Q0、Q1、Q2和Q3：

Q0 = P1
Q1 = P1 + M1/3
Q2 = P2 - M2/3
Q3 = P2

---

与许多其他编程语言一样，SVG可以绘制二次和三次贝塞尔曲线和圆弧，规范中没有任何更奇特的东西。@HummelingEngineering是的，我知道，我甚至在question@Nicholas_Kyriakides这是对你第二个问题的回答。我想你必须用一系列贝塞尔曲线来描述你的路径，控制点来自于Catmull Rom算法。是的，但这怎么可行呢question@Nicholas_Kyriakides您在问题中没有提到Bezier曲线，但这是在SVG中实现平滑的唯一方法，因此，您最终还是会使用它们。当您已经使用Ramer–Douglas–Peucker算法减少数据时，您是否尝试将其用作Bezier控制点？我不想要求比您提供的更多的信息，但如果您知道，这与我提出的解决方案相比如何？原始路径->RDP->Catmull Rom？在精度/点数/速度方面。@NicholasKyriakides一点也不知道我不直接使用BEZIER（也不使用Catmul ROM）这些是插值立方体，因此路径通过采样点，而不是接近采样点，并且这些点被转换为SVG bezier立方体控制点，因此曲线不会以任何方式改变，因此这应该足够精确。唯一可能更糟糕的是极端的方向变化质量，如小半径和/或螺旋螺钉，但这对我来说已经足够好了。我正在驾驶带有SVG路径的多维CNC机器（因此路径中的传统数据，如刀具配置…@NicholasKyriakides速度是实时的点变换是

O（1）

使用两个

+

两个

-

和两个

*

操作每个立方体和维度，因此没有问题。永远不要实际测量时间，因为它是直接在鼠标事件中计算的。。。时间测量可能比过程花费更多的时间itself@Spektre：检查“插值立方”的公式后，它实际上是统一的Catmull Rom样条。@NicholasKyriakides刚刚完成了我的gif捕获多线程实现，以加速实时编码，并且在测试时还将其添加到我的svg编辑器中，以便在我的答案底部看到添加的图像，以便您可以看到曲线在编辑过程中的样子（对于