Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'material') error

Questions
1

I imported my gltf model.
I get this error when I want to set the texture of the child elements of the model. What is the reason? How can I solve it?

my codes are here:

import { LinearEncoding, ShaderChunk, sRGBEncoding } from 'three'
import * as THREE from './three.js-master/build/three.module.js'
import {GLTFLoader} from './three.js-master/examples/jsm/loaders/GLTFLoader.js'
import {OrbitControls} from './three.js-master/examples/jsm/controls/OrbitControls.js'
import { EffectComposer } from './three.js-master/examples/jsm/postprocessing/EffectComposer.js';
import { RenderPass } from './three.js-master/examples/jsm/postprocessing/RenderPass.js';
import { GlitchPass } from './three.js-master/examples/jsm/postprocessing/GlitchPass.js';
import { ShaderPass } from './three.js-master/examples/jsm/postprocessing/ShaderPass.js';
import { LuminosityShader } from './three.js-master/examples/jsm/shaders/LuminosityShader.js';

const canvas = document.querySelector('.webgl')
const scene = new THREE.Scene()

const texture1 = THREE.TextureLoader().load( 'textures/texture1.jpg' );

//
var model;
const loader = new GLTFLoader()
loader.load('model2.gltf', function(gltf){
    console.log(gltf)
    model = gltf.scene;
    model.scale.set(0.2, 0.2, 0.2)
    model.position.set(0, 0, 0)
    model.castShadow = true
    //model.rotation.y = 3.8
    model.traverse(n => {
        if (n.Mesh) {
            n.castShadow = true
            n.receiveShadow = true
            if (n.material.map) n.material.map.anisotropy = 4
        }
    
    })


    
    scene.add(model)
 
    const child = model.getObjectByName('Cube.006_Cube.011');
    child.material.map = texture1;
}, function(xhr){
    console.log(xhr.loaded/xhr.total * 100) + "% loaded"
}, function(error){
    console.log("An error occured")
})

const sizes = {
    width: window.innerWidth,
    height: window.innerHeight
}

const camera = new THREE.PerspectiveCamera(75, sizes.width/sizes.height, 0.1, 2000)
camera.position.set(0, 1.7, 3.5)
scene.add(camera)



const renderer = new THREE.WebGL1Renderer({
    canvas: canvas,
    antialias: true,
    alpha: true,
    precision: 'highp',
    colorManagement: true
    
})

const controls = new OrbitControls(camera, renderer.domElement)
controls.autoRotate = true
controls.autoRotateSpeed = 0.7
controls.minPolarAngle = 0;
controls.maxPolarAngle = Math.PI * 0.5;
controls.enableDamping = true;
controls.dampingFactor = 0.25;

const spotLight = new THREE.SpotLight(16777215, 40)
spotLight.position.set(-1,2,0.2)
spotLight.castShadow = true
spotLight.shadow.bias = -0.0001
spotLight.shadow.mapSize.width = 1024*4
spotLight.shadow.mapSize.height = 1024*4
scene.add(spotLight)

renderer.toneMapping = THREE.ACESFilmicToneMapping
renderer.toneMappingExposure = 0.15
renderer.shadowMap.enabled = true
renderer.logarithmicDepthBuffer = true
renderer.background = new THREE.Color(0xffffff)
renderer.setSize(sizes.width, sizes.height)
renderer.setPixelRatio(Math.min(window.devicePixelRatio, 1))
renderer.shadowMap.enabled = true
renderer.outputEncoding = THREE.sRGBEncoding
renderer.precision = "highp"
renderer.render(scene, camera)

const composer = new EffectComposer(renderer);

const renderPass = new RenderPass( scene, camera );
composer.addPass( renderPass );

const glitchPass = new GlitchPass();
composer.addPass( glitchPass );

const luminosityPass = new ShaderPass( LuminosityShader );
composer.addPass( luminosityPass );


function animate(){
   
    requestAnimationFrame(animate)

    controls.update();
    //sphereCamera.updateCubeMap(renderer, scene)
    composer.render()
    renderer.render(scene, camera)
    
}

animate()
2

Try it with:

if (n.isMesh) {
3 Likes
3

i tried this but it didn’t solve my problem

4

Seems there is no object with the specified name, thus, child is undefined :thinking:

1 Like
5

This is how the child object’s name looks in blender

6

Maybe this topic will be helpful: Issue with GLTFLoader and objects with dots in their name attribute?

1 Like
7

thank you so much it worked

1 Like