Create BufferGeometry from GLTF Model

Hello,

I am trying to figure out what is the correct approach for importing a GLTF model, and then accessing its information to create a BufferGeometry object for use?

For example:
Load GLTF
Convert GLTF Model to BufferGeometry
Do Something with BufferGeometry

Thanks in advance!

O.

2 Likes

When loading a glTF asset, all geometry data are already represented as instances of BufferGeometry.

Keep in mind that a model (for example an animated mesh) always consist of one or more materials describing its surface properties and a single geometry describing its actual 3D shape.

3 Likes

Thanks for the clarification

As an example - based on the gltf loader example - would something like this do the job:

//create buffer geometry 
				var glTFGeometry = new THREE.BufferGeometry();

				var loader = new THREE.RGBELoader().setPath( 'textures/equirectangular/' );
				loader.load( 'pedestrian_overpass_2k.hdr', function ( texture ) {
					texture.encoding = THREE.RGBEEncoding;
					texture.minFilter = THREE.NearestFilter;
					texture.magFilter = THREE.NearestFilter;
					texture.flipY = true;
					var cubeGenerator = new THREE.EquirectangularToCubeGenerator( texture, { resolution: 1024 } );
					cubeGenerator.update( renderer );
					var pmremGenerator = new THREE.PMREMGenerator( cubeGenerator.renderTarget.texture );
					pmremGenerator.update( renderer );
					var pmremCubeUVPacker = new THREE.PMREMCubeUVPacker( pmremGenerator.cubeLods );
					pmremCubeUVPacker.update( renderer );
					var envMap = pmremCubeUVPacker.CubeUVRenderTarget.texture;
					// model
					var loader = new THREE.GLTFLoader().setPath( 'models/gltf/DamagedHelmet/glTF/' );
					loader.load( 'DamagedHelmet.gltf', function ( gltf ) {
						gltf.scene.traverse( function ( child ) {
							if ( child.isMesh ) {
								child.material.envMap = envMap;

								//Setting the buffer geometry
								glTFGeometry = child;

							}
						} );
						scene.add( gltf.scene );
					} );
					pmremGenerator.dispose();
					pmremCubeUVPacker.dispose();
					scene.background = cubeGenerator.renderTarget;
				} );

				//use glTFGeometry as buffer geometry.... ie. processGeometry( bufGeometry )
				processGeometry(glTFGeometry);
1 Like

You can access the geometry via child.geometry. Otherwise you reference the entire mesh.

3 Likes

Okay great - so more like this:

gltf.scene.traverse( function ( child ) {
							if ( child.isMesh ) {
								child.material.envMap = envMap;
							}

							
							//Setting the buffer geometry
							glTFGeometry = child.geometry;


						} );
1 Like
gltf.scene.traverse( function ( child ) {

    if ( child.isMesh ) {

        child.material.envMap = envMap;
        //Setting the buffer geometry
        glTFGeometry = child.geometry;

    }

} );

You only want to do this for meshes since other type of objects are part of gltf.scene like THREE.Object3D. Besides, keep in mind that a glTF asset can have multiple meshes. With your code, you only retrieve the last geometry object encountered in the traversal.

5 Likes

Great thanks so much! Definitely clears things up.

Reason for this is I have been trying to create custom shapes and objects to be loaded as gltf, then to be converted to BufferGeometry for use as physics volumes as in the volumes example: https://threejs.org/examples/?q=volume#webgl_physics_volume

Getting a bunch of new errors now passing the buffer geometry into the createSoftVolume(bufferGeom, mass, pressure ) function - but for now I guess the question has been answered! Thanks again!

1 Like