昨天，我将经典的Perlin噪声（src：http://mrl.nyu.edu/~perlin/doc/oscar.html#noise）移植到了JavaScript中。奇怪的是，所产生的噪声看起来与我的预期有很大不同。经典的Perlin噪声使用线性插值/钳位，但是噪声是平滑的而不是边缘化的。它看起来更像余弦插值。
似乎Perlin以不同的方式使用lerp函数。
这是移植到JavaScript的原始代码（带有画布图片）：
http://jsfiddle.net/fDTbv/
这是有趣的部分：
t = vec[0] + N;
bx0 = Math.floor(t) & BM;
bx1 = (bx0+1) & BM;
rx0 = t - Math.floor(t);
rx1 = rx0 - 1.;
sx = s_curve(rx0);
u = rx0 * g1[ p[ bx0 ] ];
v = rx1 * g1[ p[ bx1 ] ];
return lerp(sx, u, v);
u和v总是会改变。为什么？ u和v不应代表sx之前的点和之后的点，因此不改变吗？
我将代码更改为“我期望的样子”：http://jsfiddle.net/8Xv8G/
还有有趣的部分：
bx0 = Math.floor(x) & BM;
bx1 = (bx0+1) & BM;
u = g1[ p[ bx0 ] ];
v = g1[ p[ bx1 ] ];
return lerp(x - Math.floor(x), u, v);
我的问题：
为什么Perlin使用lerp功能的方式如此不同？
最佳答案
Here您可以从最初的Perlin演讲中找到一个Java applet，该Java applet非常清楚地说明了整个2D噪声计算过程。佩林噪声函数是连续的，因为在每个点（在一维中），它是两个“平滑”线性梯度的线性插值。 “平滑”来自s_curve函数，该函数只是hermite函数，实际上是余弦插值的近似值。但是，我将让您留在applet和本演示文稿的其余部分中，以获得更好的解释。
也许您还会发现this project of mine有趣：这是一个javascript应用程序，可在html5画布上呈现Perlin和Simplex 2D噪点。请查看源代码，以获取这些功能和其他噪声功能的完整javascript实现。
希望能有所帮助，再见！
关于javascript - 线性插值如何在经典的Perlin噪声中工作？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/10528988/