关于使用 THREE.InstancedBufferGeometry 的问题答案

【问题标题】：Questions about using THREE.InstancedBufferGeometry关于使用 THREE.InstancedBufferGeometry 的问题
【发布时间】：2015-12-01 11:56:06
【问题描述】：

有没有人熟悉 THREE.InstancedBufferGeometry？

我拥有的模型数据只有顶点和面（三角形索引），而相同的原子模型将应用于视图中的许多实例。但是，由于文件不足，我只是不知道该怎么做。

我猜/期待这样的事情：

var geo = new THREE.Geometry();
foreach(vertex) geo.vertices.push(vertex);
foreach(face) geo.faces.push(face);
geo.computeNormals();
var buffer = new THREE.BufferedGeometry().fromGeometry(geo);
geo.dispose();
var instances = new THREE.InstancedBufferGeometry();
copy buffer.positions to instances;
copy buffer.normals to instances;
copy buffer.index to instances;
copy buffer.colors to instances;
var offset = new THREE. InstancedBufferAttribute (...);
foreach(instance new location) offset.setXYZ(...);
instances.addAttribute('offset', offset);

var mat = new THREE.someMaterial (...);
var mesh = new THREE.Mesh(instances, mat);
scene.add(mesh);

会有用吗？

无论如何，我也可以问一下geometry.colors和material有什么区别吗？在我之前的经验中，我总是使用材质来制作网格，但这是我第一次注意到每个顶点都有一个颜色属性。如果同时应用了不同颜色设置的顶点颜色和材质，会发生什么？

谢谢！

【问题讨论】：

标签： three.js

【解决方案1】：

经过很长一段时间，我发现这更有效：

var geometry = new THREE.Geometry();
var geometry_array = [...];
geometry_array.forEach(function(geo)) {
   geometry.merge(geo);
}//next

var buf = new THREE.BufferedGeometry().fromGeometry(geometry);
geometry.dispose();
var mesh = new THREE.Mesh(buf, material);
scene.add(mesh);

【讨论】：

【解决方案2】：

最后。只需复制多个 BufferGeometry 即可。

【讨论】：