Incorrect vertex count

Questions
1

Hello.
When I load a simple cube as obj I get an incorrect vertex count. If I use geometry.getAttribute(“position”).count I get 36 vertices. (Must be 8) If I use renderer.info.render I get 0 vertices, but edges and faces are shown right.
Code:

var manager = new THREE.LoadingManager();
var loader = new THREE.OBJLoader(manager);
loader.load('http://127.0.0.1/public/mesh.obj', function (object) {
        object.rotation.x += 0.5;
        object.material = new THREE.MeshPhongMaterial({
            color: 0xff0000,
            polygonOffset: true,
            polygonOffsetFactor: 1,
            polygonOffsetUnits: 1
        });
        scene.add(object);
        var positionAttribute = object.children[0].geometry.getAttribute("position").count;
        console.log(positionAttribute);
        obj = object;
        console.log(renderer.info.render);
    });
2

Check number of vertices into obj file. Or upload here/

3

I’ve checked that in Blender and in some web 3d viewer. I got 8 vertices. I also tried to load another mesh - Sphere. I got 2880 points. Must be 482.
mesh.obj is the cube. mesh2.obj is the sphere.

mesh.obj (992 Bytes)
mesh2.obj (63.0 KB)

4

The count shown is correctly representing what WebGL is rendering. It’s very common that the number of vertices in Blender will be different from the number of vertices required by WebGL or other graphics APIs. For example, a cube with vertex normals and hard edges cannot be rendered in WebGL using only 8 vertices, because the normals must be different for each ‘face’ of the cube, and vertices cannot store per-face data. Similarly, different vertex colors or UVs for each face would require more vertices.

If you delete any vertex normals (or other distinct vertex attributes) and call BufferGeometryUtils.mergeVertices( geometry ) you can can merge the additional vertices, using material.flatShading = true to get a flat effect without the normals. When exporting to the glTF/GLB format, disabling the “Export normals” option will give the same effect, but I’m not sure about Blender’s OBJ exporter.

5

For testing WebGL, I used this site service. This one also uses three.js. But in this service vertex count is right.
Okay, can you show me how to use BufferGeometryUtils? I’m a beginner and I don’t use node.js. If I type:

new THREE.BufferGeometryUtils.mergeVertices(object.children[0].geometry);

Then I get the error:

THREE.BufferAttribute: .setArray has been removed. Use BufferGeometry .setAttribute to replace/resize attribute buffers

Source

P.S.: Exporter is OK:
From mesh.obj:

v 100.000000 100.000000 -100.000000
v 100.000000 -100.000000 -100.000000
v 100.000000 100.000000 100.000000
v 100.000000 -100.000000 100.000000
v -100.000000 100.000000 -100.000000
v -100.000000 -100.000000 -100.000000
v -100.000000 100.000000 100.000000
v -100.000000 -100.000000 100.000000
6

BufferGeometryUtils is one of the examples that must be used from examples/{js,jsm}/utils/BufferGeometryUtils.js as shown here: installation. It’s important to use a version from the same version of three.js as you are using.

You’ll also need to delete any vertex attributes that might be different for different faces, otherwise vertices cannot be merged:

geometry.deleteAttribute( 'normal' );
geometry.deleteAttribute( 'uv' );
geometry = BufferGeometryUtils.mergeVertices( geometry );
7

Thanks. It works correctly.

1 Like