Hi
I’ve loaded an .obj model and I’m using MeshPhysicalMaterial to display a glass like surface.
The orginal 3D model had quads on the surface, by saving it as an .obj these quads turn into triangles. To create the facetted look I used computerVertexNormals()
to have the 3 vertex normals align in the exact same direction (which happens automatically on .obj non-indexed geometries).
This of course creates the problem that the triangles have normals aligned to their triangle and since a quad consists of 2 triangles I see a visible seam that seperates the two triangles.
My next thought was to copy the normal information from 1 triangle to the neighbouring triangle. So that the light would be calculated on both of them exactly the same. But the problem persists.
const positionAttribute = obj.geometry.attributes.position
const normalAttribute = obj.geometry.attributes.normal
const pA = new Vector3(), pB = new Vector3(), pC = new Vector3(), cb = new Vector3(), ab = new Vector3()
for ( let i = 0, il = positionAttribute.count; i < il; i += 3 ) {
pA.fromBufferAttribute( positionAttribute, i + 0 );
pB.fromBufferAttribute( positionAttribute, i + 1 );
pC.fromBufferAttribute( positionAttribute, i + 2 );
cb.subVectors( pC, pB );
ab.subVectors( pA, pB );
cb.cross( ab );
// Original triangle
normalAttribute.setXYZ( i + 0, cb.x, cb.y, cb.z );
normalAttribute.setXYZ( i + 1, cb.x, cb.y, cb.z );
normalAttribute.setXYZ( i + 2, cb.x, cb.y, cb.z );
// Neighbouring triangle
normalAttribute.setXYZ( i + 4, cb.x, cb.y, cb.z );
normalAttribute.setXYZ( i + 5, cb.x, cb.y, cb.z );
normalAttribute.setXYZ( i + 6, cb.x, cb.y, cb.z );
}
normalAttribute.needsUpdate = true
obj.geometry.normalizeNormals()
Am I overlooking something? I don’t know the exact internals of MeshStandard & MeshPhysical Materials. Any Idea?
Thanks in advance!