通过单独缩放优化合并网格的绘制调用

时间:2017-09-16 14:25:38

标签: three.js

我有10K立方体,绘制调用很高,很好.. 10K

你可以在这里看到: http://thegrook.com/three.js/merge1.html

如果我将所有立方体组合到单个网格中,则绘制调用将减少到一个。

你可以在这里看到: http://thegrook.com/three.js/merge2.html

但是在第一个例子中,我根据与相机的距离来改变每个立方体的缩放比例

所以无论什么是缩放 - 立方体在屏幕上保持相同的大小,这给了我所需的效果:

相机越近 - 立方体之间的密度越低

在第二个例子中 - 这不起作用,因为缩放影响整个网格而不是每个立方体

任何想法如何用较少的绘制调用来实现密度效果?

感谢。

*已编辑1 *

我设法用实例化解决这个问题并渲染250K对象并保持60fps

当我缩小时 - 对象重叠 - 这对我的情况来说没问题。

但是错误的是所有的纹理都闪烁了许多......

似乎所有实例化都没有固定的绘图顺序

有办法解决这个问题吗?

这是一个例子: http://thegrook.com/three.js/instancing3.html

*只需用鼠标滚轮缩小

*已编辑2 *

看起来如果我在材料上禁用了deepWrite - 问题就解决了

这是正确的解决方案吗?

0 个答案:

没有答案