I have a human skeleton model in fbx format, and when rendering it with 90% transparency, I use trackballControls to rotate it. When the model is rotated to certain orientations, it is displayed incorrectly.
The light:
threeInitData.light = new THREE.DirectionalLight(0xffffff, 0.8)
threeInitData.light.position.set(0, 0, 30)
threeInitData.scene.add(threeInitData.light)
The camera:
threeInitData.camera = new THREE.OrthographicCamera(
this.deviceWidth / -2,
this.deviceWidth / 2,
this.deviceHeight / 2,
this.deviceHeight / -2,
0.1,
5000,
)
threeInitData.camera.position.z = 3
threeInitData.camera.position.set(0, 0, 400)
The material:
const material = new THREE.MeshStandardMaterial({
color: '#fafad2',
roughness: 0,
metalness: 0.1,
side: THREE.DoubleSide,
opacity: 0.9,
transparent: true,
depthWrite: false,
})
At the beginning, everything was fine:
And when I rotate the model slightly with the controller:
I’ve tried everything and can’t solve the problem.