Why my mirror modifier in blender is not working in ThreeJS when I show my GLTFLoader()


So nothing really wrong with my code but my only problem is that why my blender sample item is not same as my threeJS show it? Please help I’m so desperate to solve this. This is the sample pictures.

Uploading: Screenshot (354).png…

and here is the code.

        const allScenes = document.querySelectorAll('.small-circ')

        allScenes.forEach((elem,i) => {

            let scene = new THREE.Scene()
    
            let fieldOfView = 100,
            aspectRatio = window.innerWidth / window.innerHeight,
            near = 1,
            far = 50,
            camera = new THREE.PerspectiveCamera(fieldOfView, aspectRatio, near, far);
    
            let renderer = new THREE.WebGLRenderer({antialias:true,alpha:true})
            renderer.setSize(window.innerWidth,window.innerHeight)
    
            window.addEventListener("resize",() => {
                let width = window.innerWidth;
                let height = window.innerHeight;
                renderer.setSize(width,height)
                camera.aspect(width/height)
                camera.updateProjectionMatrix()
            })

            elem.appendChild(renderer.domElement)

            let loader = new GLTFLoader();

            loader.load(headset,function (gltf) {
                scene.add(gltf.scene)
                renderer.render(scene,camera)
            })


            camera.position.set(10,1,2.5)
            camera.lookAt(0,0,0)


            var light = new THREE.PointLight(0xFFFFFF,1,1000)
            light.position.set(0,0,0);
            scene.add(light)
    
            var light = new THREE.PointLight(0xFFFFFF,2,1000)
            light.position.set(0,0,2);
            scene.add(light)


        })

This code is working perfectly fine but the thnig is that I don’t understand why when it show in terminal it cut half my mirror modifier in ThreeJS

A simple general advice would be to check glTF consistency before assessing code side. You can start droping your exported file in this excelent glTF viewer (from @donmccurdy ) and evaluate the result.

I don’'t remember the case with mirroring geo, but as a thumb rule consider applying every modifier in blender before exporting.

I don’t understand much about it hahaha…I’m still exploring and this giving me a headache anyway here what it looks like…which show the same way.

nevermind I already fixed it…but how can I apply a mirror on it?? because maybe someday it will be useful and make more easier than copying it on other side?

select modifier , press ctrl + A

or while exporting check apply modifiers checkbox in the side panel

1 Like