Three.js 噪声导致的网格

只是看看简介实验，想知道它是怎么做的

必须是由使用gpgpu计算的噪波引导的实例化几何体

但在做了一点修改后，我感到头痛，想知道如何从网格中每个顶点的模拟纹理中获得位置，并带有噪声？对于仅代表纹理上单个像素的粒子来说很容易，但是对于更复杂的几何体如何实现呢

也许可以从着色器外部的模拟纹理读取每个像素？ 将其渲染到画布，遍历每个像素并将其指定给相应的实例

---

任何提示都非常受欢迎

这是通过GPGPU以每帧2个渲染步骤完成的

首先，他们使用具有RGB噪波生成器的自定义着色器创建了一个平面，但该平面不是渲染到画布，而是渲染到画布。结果存储在可通过访问的纹理中

然后，他们使用第二个场景中看到的彩色条生成了一个实例化几何体，在该场景中，您可以使用material.noiseMap=target.texture；之类的内容将存储的纹理从步骤1传递到材质；。在顶点着色器中，可以读取每个像素的RGB通道，并将其指定给每个顶点的XYZ位置

下面是Three.js站点中的一个类似示例，供您浏览代码：

---

这里有一个指向标准GLSL噪声生成函数的链接：我认为他们使用psrNoise2D.GLSL来生成这种类型的运动。

这看起来有点类似于此：–可能那里的代码给了您一些见解