Performance three.js中数千行的性能问题
这是我在这里的第一个问题，所以我希望它符合指南。也请原谅我的英语不好 我目前正在开发一个基于three.js的WebGL应用程序，它可以显示数千个多维数据集以及这些多维数据集之间的行。我有几个性能问题，所以我决定将所有立方体合并到一个几何体中。这有一点帮助，但实际上，数千行（都有自己的几何体（基于三个.js的NurbCurve示例）和着色器材质（着色器从行首到行尾混合两种颜色并控制不透明度）会降低性能。我最大的数据包括9000多行和5000多个立方体。没有这些行，FPS速率在45-50（DirectX）或20 FPS（OpenGL）之间，但有了这些行，性能下降到5 FPS。我只有一个Intel HD Graphics（第5代）图形卡，所以最大FPS似乎限制在60 FPS，但在我的情况下，这就足够了。 正如我之前所说的，线条是NURBS曲线，从短曲线到长而复杂的曲线。另一个要求（这让我有点头疼；-））是每条线条的宽度不同，因此我实际上必须使用OpenGL，这在我的情况下速度较慢，而且还会导致一些其他问题 不管怎样，我尝试了几种方法，但都没有真正帮助我解决这个问题 1）为每条线创建管道并合并几何体。->这将场景的创建速度从1秒降低到几分钟。此外，FPS率无法提高。这实际上是预期的，因为这种方法产生了大量的顶点和面 2）减少曲线点。->从200点减少到50点，这有助于稍微提高FPS。降到25分并没有带来任何改善。我想写一个方法来减少不需要的点（比如在直曲线上，2而不是50点就足够了），但我不知道如何实现这一点，所以我先考虑了其他方法。也许我会回到这个话题 3）使用BufferGeometry。->似乎BufferGeometry不能与着色器材质一起使用。至少在我的情况下，我没有让它工作，所以我的尝试没有显示任何东西。顺便说一下，我使用THREE.BufferGeometryUtils从NURBS曲线创建缓冲几何体。我尝试将THREE.VertexColors设置为函数的参数，并在几何体中设置ColorsEndUpdate，但仍然没有显示。事实上，我也尝试了buffergeometry和路缘几何，但在性能上并没有得到任何改进 4）使用样条曲线而不是NURBS曲线。->曲线的路径与我希望的不同，没有任何改进 5）使用三个.LinePieces将线合并为一条线。->好吧，虽然我不得不将顶点的数量增加一倍，但这实际上帮助很大。在DirectX中，性能从5 FPS提高到25 FPS（OpenGL仍为4 FPS），但这种解决方案不适合我的情况。原因是行的宽度不能不同，这是在DirectX限制为1的情况下。我想知道其他人是如何解决线宽限制问题的，并且发现有些人通过几何体着色器创建了更粗的线条。所以我的新希望是这个几何着色器。但后来我发现WebGL不支持几何体着色器Performance three.js中数千行的性能问题,performance,three.js,line,webgl,Performance,Three.js,Line,Webgl,这是我在这里的第一个问题，所以我希望它符合指南。也请原谅我的英语不好 我目前正在开发一个基于three.js的WebGL应用程序，它可以显示数千个多维数据集以及这些多维数据集之间的行。我有几个性能问题，所以我决定将所有立方体合并到一个几何体中。这有一点帮助，但实际上，数千行（都有自己的几何体（基于三个.js的NurbCurve示例）和着色器材质（着色器从行首到行尾混合两种颜色并控制不透明度）会降低性能。我最大的数据包括9000多行和5000多个立方体。没有这些行，FPS速率在45-50（Dire
很抱歉，到目前为止，我对我的方法做了很长的解释。在尝试了所有这些之后，我不能想出任何新的想法。现在，我想从专家那里知道，我是否应该只使用FPS drop，还是还有其他方法可以尝试？我想出了一个主意，按宽度捆绑行，然后使用
THREE.LinePiecesrenderer.infoBufferGeometryShaderMaterialrenderer.infoBufferGeometryBufferGeometryUtils