How to subdivide GLTF mesh?

Questions
,
1

Found this topic: Create BufferGeometry from GLTF Model

Will do the exact same, but I don’t know, how to apply subdivision changes on my mesh in object. Three example fits not and is to much complicated, I guess. This is, what I have for now:

var manager = new THREE.LoadingManager();
  new GLTFLoader(manager)
    .load('cube.glb', function(gltf) {
      gltf.scene.traverse( function ( child ) {
    if ( child.isMesh ) {
        glTFGeometry = child.geometry;
    }
} );

scene.add(gltf.scene);

Now, before and after adding gltf to scene, I would like to change subdivisions on this object (e.g. Cube).

var subdivisions = 2;
var modifier = new SubdivisionModifier(subdivisions);
modifier.modify(glTFGeometry);

Think, this does what I need. But how can I apply this to gltf mesh? I cannot see any changes in scene.

2

SubdivisionModifier.modify() returns a new geometry object. Meaning it does not affect the existing one. Try it like so:

var manager = new THREE.LoadingManager();
  new GLTFLoader(manager)
    .load('cube.glb', function(gltf) {
      var subdivisions = 2;
      var modifier = new SubdivisionModifier(subdivisions);
      gltf.scene.traverse( function ( child ) {
      if ( child.isMesh ) {
         child.geometry = modifier.modify( child.geometry );
      }
} );

scene.add(gltf.scene);
3

Thank you @Mugen87, will try after dinner. :slight_smile:

EDIT: Works. THX :slight_smile:

1 Like
4

Have an addtional question, may you can answer me. I now want to have access to child material outside of the loader.

var objectMesh;
var manager = new THREE.LoadingManager();
new GLTFLoader(manager)
.load('cube.glb', function(gltf) {
    gltf.scene.traverse( function ( child ) {
         params.geometry = child.geometry;
         params.material = child.material;
    } );
objectMesh = new THREE.Mesh( params.geometry, params.material );
scene.add( objectMesh );
} );

But when I call objectMesh outside the loader (e.g. renderer), I get an error message: TypeError: objectMesh is undefined

How can I load gltf into threejs with full access to geometry and material outside the loader? Need to change envMap, color, roughness and so on.

EDIT: Found a solution by myself! Finally after two days…

var geometry;
var material = new THREE.MeshStandardMaterial();
var objectMesh = new THREE.Mesh( geometry, material );
scene.add( objectMesh );

and then…

var manager = new THREE.LoadingManager();
new GLTFLoader(manager)
.load('cube.glb', function(gltf) {
    gltf.scene.traverse( function ( child ) {
         objectMesh.geometry = child.geometry;
         objectMesh.material = child.material;
    } );
} );