Currently, I am developing webgl software for generating 3D models that heavily relies on dynamic geometry. During my work, I have encountered some unusual behavior which I have managed to isolate in a JSFiddle demo.
It appears that any new faces added after adding a geometry instance to the scene will not be properly rendered. In wireframe mode, the new geometry is not rendered at all. Additionally, when using textured materials, I have noticed that sometimes new geometry is not rendered depending on the camera angle.
You can see this issue in action by watching this video.
Going back to the JSFiddle, I utilized an existing Three.js code sample (misc_exporter_obj.html) as a base, but on line 7, I created a generic function to add a triangle to the geometry. The addGeometry function is called on startup, and if you uncomment line 36, you can see the expected result.
var material = new THREE.MeshBasicMaterial( { wireframe : true} );
geometry = new THREE.Geometry();
addTriangle(-50, -50, 50, -50, 50, 50);
//addTriangle(-50, -50, -50, 50, 50, 50); // UNCOMMENT TO TEST WHAT FINAL OUTPUT SHOULD LOOK LIKE.
scene.add( new THREE.Mesh( geometry, material ) );As recommended in the Three.js guide on updating things, lines 43-47 try to add a new triangle when you click the "transform triangle" button by setting the verticesNeedUpdate and elementsNeedUpdate flags:
function addTriangleFace(){
addTriangle(-50, -50, -50, 50, 50, 50);
geometry.verticesNeedUpdate = true;
geometry.elementsNeedUpdate = true;
}
Am I making a mistake in my approach? Should I consider submitting a bug report?
Thank you.
Disappearing Mesh Update:
I believe I have identified the reason behind the strange behavior that caused my mesh to disappear based on camera orientation. According to this answer, Three.js might have thought that the mesh was outside the camera's frustum.
It seems that the new vertices were not considered when determining if the object was within the frustum, so I decided to disable culling since the object being drawn is the main element in the scene.