在WebGL中绘制3D树结构

Question

我正在根据此处显示的技术使用gwt-g3d库在WebGL中绘制大型有向非循环图：http://www-graphics.stanford.edu/papers/h3/

此时，我有一个简单的两级图形渲染：

性能很糟糕 - 渲染这个东西需要大约1.5-2秒。我不是OpenGL专家，所以这是我采取的一般方法。也许有人可以指出一些可以更快地获得这种渲染的优化。

我很惊讶将MODELVIEW矩阵和缓冲区推送到显卡需要多长时间。这是浪费时间的大部分时间。我应该在顶点着色器中进行MODELVIEW转换吗？

这让我相信操纵MODELVIEW矩阵并为每个节点推送一次应该不是一个坏习惯，但时间不是谎言：

https://gamedev.stackexchange.com/questions/27042/translate-the-modelview-matrix-or-change-vertex-coordinates

Answer 1

将较大块中的节点分组，而不是单独渲染它们。使用最不可能修改的应用转换对所有几何体进行背景缓存，并将其存储在一个缓冲区中并在一次调用中呈现。

另一个解决方案：将节点（框+线）存储在一个缓冲区中（您可以存储当前时间内需要的更多）以及它们在纹理中的转换。基于节点索引（纹理坐标）在顶点着色器中应用变换它应该更快更快。

测试支持使用this site。我有MAX_VERTEX_TEXTURE_IMAGE_UNITS | 4

最佳解决方案是Geometry Instancing，但目前WebGL不支持。