希望优化 webgl 中的线条渲染（使用 three.js 库）

Question

最近开始学习 webGL，决定使用 Three.js 库。

目前，除了渲染超过 100K 的立方体外，我还尝试在这些立方体之间渲染线条（超过 100K）。

当我尝试绘制线条而不是立方体时，会出现渲染问题。渲染 100k 立方体相对较快。即使渲染这 100K+ 线也相对较快，但是当我尝试使用 TrackballControls 进行缩放/平移时，FPS 下降到几乎为 0。

我搜索了 StackOverflow 和其他各种网站，以提高我的应用程序的性能。我使用了合并几何技术，延迟渲染线条（基本上一次使用 js 中的超时 x 多维数据集/线条），并调整线条的外观以需要最少的渲染时间。

是否有任何其他方法可以构建线条以不影响渲染/fps？我正在构建一组线条，然后将其添加到场景中。但是有没有一种方法可以与线合并？我应该使用不同的对象来构建我的线条吗？

我只是觉得奇怪的是，我可以轻松地渲染/平移/缩放/保持超过 10 万个立方体的高 fps，但是使用线条（这是除了点之外最基本的几何形式），一切都崩溃了。

Answer 1

您已经（艰难地）发现了图形芯片供应商将重点放在他们的设计驱动程序上的地方。但这在 3D 图形中是可以预料的，因为我的许多游戏都没有使用线（是的，最基本的几何图形），因此它们不像多边形那样受到太多关注。您可以查看示例 webgl_buffergeometry_lines.html，这可能是绘制线条的更快方法。