Here I go again, this time I want to know the cause of the problem, the canvas background color is purple, is that the default color of the threejs engine?
A few months ago, I used hdr for lighting, and this problem also occurred. Recently, I used cubeMap for lighting, but the problem still occurred. I don’t want the background color to be purple, but this problem has been bothering me for a long time, and I still can’t solve it and can’t track it down; So I wish, can i change the background color of canvas to transparent instead of the default purple to solve the problem !!!!
My scene is very simple, just add a car model, and then use hdr or cubeMap for lighting, there is no additional code, it will only appear in ios, will not appear in Android, or I use loadManager can track this problem?
I’m really out of options!!!
I don’t know if this code works
…
scene.background = null
const loader = new THREE.CubeTextureLoader();
loader.setPath( ‘textures/cube/pisa/’ );
const textureCube = loader.load( [
‘px.png’, ‘nx.png’,
‘py.png’, ‘ny.png’,
‘pz.png’, ‘nz.png’
] );
scene. environment = textureCube;
…
Maybe you already resolved the problem, but here is what I would have tried:
- sharing a live example, so people can see whether they get this magenta background too (I don’t have access to IOS, but many other do)
- using another texture for the cube map can resolve the dilemma whether the problem is in the texture, or is not related to the texture
- simplifying the program as much as it is possible (e.g. replacing the 3D model with a simple cube)
- removing all decorations and special features (like posteffects, transparency, antialias) and reverting to more basic materials
- trying the same code with regressively older Three.js releases – this will help to find whether some change in Three.js is “responsible” for the effect