问题
I'm building a "paper cutout" world in three.js. All my models are simple "planes," and I texture them with PNGs that have alpha channels to trim the plane to a more pleasing shape.
The strange thing: the transparency appears and disappears unpredictably, based on the position of the plane and the position of the camera.
Symptom 1: if the plane is partially below the ground plane, transparency works, but if I move it above the ground plane the transparent area fills with white.
Symptom 2: building on symptom 1: if I now move the camera around so that the look vector is almost parallel to the plane, the transparency starts working again.
Any thoughts? Looks a bit like an optimization gone wrong or possible a z-write problem? is the texture writing to z regardless of alpha value? Were that the case, I wouldn't think it would be sensitive to position or camera angle.
回答1:
You need to set the transparent flag to true in the material.
new THREE.MeshBasicMaterial( { map: transparent_map, transparent: true } );
来源：https://stackoverflow.com/questions/10857233/in-three-js-alpha-channel-works-inconsistently