1

In THREE.js, If two plane are orthogonal with each other, the transparent of one plane is wrong.

var material = new THREE.MeshBasicMaterial({
    transparent: true,
    side: THREE.DoubleSide,
    fog: false,
    color: 0x00FF00,
    opacity: 0.3
}); 

jsfiddle code
two plane

If you add Three plane, the result is the same, there is no transparent effect in the first plane.
jsfiddle Code1 Three plane

yongnan
  • 405
  • 7
  • 20

1 Answers1

0

Problem solved : from Three.js / WebGL - transparent planes hiding other planes behind them

thanks @Alex Under

jsfiddle code

var material = new THREE.MeshBasicMaterial({
    transparent: true,
    side: THREE.DoubleSide,
    fog: false,
    color: 0x00FF00,
    opacity: 0.2, depthWrite: false, depthTest: false
});
Community
  • 1
  • 1
yongnan
  • 405
  • 7
  • 20
  • Additionaly, If you have the similar problem and your material has map texture, you should also take the texture into consider, if you texture has the alpha value, this will also cause the problem like this. Actually, I find this cause the problem in my project. – yongnan Jun 23 '14 at 17:57