我试图在 SVG 中绘制一条路径，在一系列点之间绘制一条平滑曲线。
例如 - 看这个(其中“interpolations”设置为“monotone”):
http://bl.ocks.org/mbostock/4342190
我在这里找到了一个用 JavaScript 算法的出色实现:
http://blog.mackerron.com/2011/01/01/javascript-cubic-splines/
我可以使用此功能在曲线上创建任意数量的点，并使用这些点创建一条沿着曲线的多段线。如果点数很多，我的曲线就会相对平滑。
但我真的很想能够创建一个使用三次贝塞尔曲线的路径，就像 d3 那样。
我还发现了 Catmull Rom Splines 的 SVG 实现:https://gist.github.com/njvack/6925609
这很好用，但与单调三次插值不同，这往往会“超过”给定的点，这对于我正在做的事情来说是 Not Acceptable 。
显然 - 我可以使用 d3，但我真的希望能够在没有库的情况下做到这一点，如果可能的话。
提前致谢。
最佳答案
您可以提取 d3 的实现，它位于 src/svg/line.js 中名为 d3_svg_lineMonotoneTangents 的函数中:
// Interpolates the given points using Fritsch-Carlson Monotone cubic Hermite
// interpolation. Returns an array of tangent vectors. For details, see
// http://en.wikipedia.org/wiki/Monotone_cubic_interpolation
function d3_svg_lineMonotoneTangents(points) {
// ...
return tangents;
}
Permanent link to d3_svg_lineMonotoneTangents in d3 v3.5.5 .
关于javascript - 没有像 d3 这样的库的单调三次插值的 SVG 实现，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29393989/