We recently switched to r68 and are moving all our geometries to THREE.BufferGeometry
.
We were using THREE.MeshFaceMaterial
in a lot of places and according to BufferGeometry faces materials THREE.BufferGeometry
does not support it. The solution seems to be to create multiple meshes, I tried this but it doesn't seem to work and I don't get any errors.
My approach is as follows:
var oldGeometry = ... // THREE.Geometry from our loader
var materials = ... // Material array from our loader, uses lightmaps, normalmaps etc.
var bufferGeometry = new THREE.BufferGeometry();
var geometry = bufferGeometry.fromGeometry(oldGeometry);
var group = new THREE.Object3D();
materials.forEach(function(material){
group.add(new THREE.Mesh(geometry, material));
});
geometry.attributes.uv = geometry.attributes.uvs;
This works fine without errors, but when rendered, all the lightmaps etc don't seem to work, the geometry looks fine but has just one color.
Any hints on how to implement this properly?
Edit:
UV issue: https://github.com/mrdoob/three.js/issues/5118
Edit 2:
After digging through the WebGLRenderer Source Code, I think implementing this is a lot more work then it's worth it right now. We will stick with the old geometry for now, but I'm still open for suggestions ;)
Edit 3: A basic way to to do this yourself can be found here: https://github.com/mrdoob/three.js/issues/5268
There is work being done here https://github.com/mrdoob/three.js/issues/5417 to improve the three.js exporter, e.g. exporting buffergeometries with multiple materials.