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