我有一组随机点，想要用raphaeljs创建一个平滑的svg形状。 连接点我使用catmull-rom-spline。问题是路径关闭的点不顺畅。
这是我的项目中的一个示例路径：
M125,275R 125,325 175,325 225,325 275,325 225,275 175,275 125,275Z
我还创建了一个jsfiddle：http://jsfiddle.net/ry8kT/
这可以通过catmull曲线实现吗？ 如果没有，你能给我一个如何获得完全平滑的形状的例子吗？
提前多多感谢， 麦克法兰
答案 0 :(得分：3)
我自己解决了这个问题：
我使用二次曲线和计算中点而不是使用catmull rom样条。 请注意，此解决方案仅在您想要绘制平滑的形状时才有效，但如果路径必须直接通过这些点，则无效。
这是它的工作原理：
第一： 将行开始设置为第一个点，然后立即执行moveTo命令
M point1.x,point1.y M
这对于关闭没有边缘的路径非常重要。
现在循环遍历每个点，并在当前和下一个点之间加上计算出的中点，然后是二次曲线，下一个点作为控制：
mid.x,mid.y C next.x,next.y
使用以下方法计算A和B之间的中点M：
M.x = (A.x-B.x)/2 + B.x
M.y = (A.y-B.y)/2 + B.y
循环遍历所有点后，您必须创建一个二次曲线到第一个和第二个点的中点，第一个点作为对照：
C first.x,first.y mid.x, mid.y
现在使用Z关闭路径，以便填充形状：
Z
由于路径开头有两个moveTo命令，因此无法看到此连接。
要查看我的解决方案的结果和源代码，请访问更新的jsfiddle： http://jsfiddle.net/ry8kT/1/
答案 1 :(得分：3)
在你的第一个例子中，路径从125,275开始，在关闭前再次达到125,275。因为'Z'创建了另一个连接起点和终点的平滑路径段，所以你会得到那个小循环。如果在返回起点之前将其关闭，则会获得所需的平滑形状，触及所有给定的点。
这是示例路径的更正版本：
M125,275R 125,325 175,325 225,325 275,325 225,275 175,275Z