ThreeJs Loads more vertices than there are in an obj file

Question

I have this code:

function render_obj(objPath){
  var loader = new THREE.OBJLoader();
  loader.load(
    objPath,
    function ( object ) {
      child = object.children[0];
      var geometry = new THREE.Geometry().fromBufferGeometry( child.geometry );      
      var material = new THREE.MeshBasicMaterial({wireframe: true});
      model = new THREE.Mesh(geometry, material);
      scene.add(model);
    },
    function ( xhr ) {
      console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );
    },
    function ( error ) {
      console.log( 'An error happened' );
    }
  );
};

now man.obj has 214 vertices and 332 faces. When I check the faces by doing this: model.geometry.faces.length I get 332 which is correct. When I do model.geometry.vertices.length I get 996, where I should get 214...

Why is that ?

Answer 1

The loader that you are using is creating something called “triangle soup”. This means that your N triangles are actually defined by N * 3 vertices. A triangle itself doesn't really exist, it's just interpreted from the vertices. The first three make a triangle, the next three and so on. If you have a continuous smooth mesh, a lot of vertices will be duplicated.

What you are probably interested in is “indexed” geometry. In this type of geometry, you have an actual triangle buffer holding the index is for the vertices. In a continuous smooth mesh, one vertex can be shared by many triangles.