Updating map.minFilter and map.magFilter in r3f useGLTF

hello,

would anyone happen to know the proper way to set the minFilter and magFilter of the child nodes in a gltf file when using drei’s useGLTF, i’ve tried to get my head around how material properties are accessed with no luck as of yet…

i’m trying with the following approach…

const { nodes, materials } = useGLTF(url);
//this works
materials.obj1.map.minFilter = THREE.LinearFilter
//this does not
for (const [key, value] of Object.entries(materials)) {
      if (value.isMaterial) {
        console.log(value.map)
        value.map.minFilter = THREE.LinearFilter
        value.map.magFilter = THREE.LinearFilter
      }
}

the console.log(value.map) returns a log of the textures for each material in the console but trying to set the min or mag filter returns the error Cannot set properties of null (setting 'minFilter'), whereas setting the min filter above the for loop for individual materials works fine…

how can i easily set the min and mag filter for each material in a loop without having to declaratively do this with every individual objects material in the gltf.scene graph? some gltf files can have lots of materials which seems like a lot of work to go through and set each individually…

thanks for any guidance on this

either just traverse, or you can use the materials collection. in your case i think it’s a simple mistake, not all materials have a map, to access the filter without checking if map is falsy must crash. i think you meant to write if (value.map) { ....

Object.values(materials).forEach(m => 
  m.map && (m.map.minFilter = m.map.maxFilter = THREE.LinearFilter))
1 Like

:expressionless::man_facepalming: Of course, there is one tiny, easy to overlook, object in the gltf model that doesn’t have a texture,

if (value.map){
}

solves this, its the same check usually used in vanilla env’s, thanks for pointing this out, completely skipped my mind

1 Like