Mesh Opacity issue when the mesh is invisible

0
votes

I have created a jsfiddle [ http://jsfiddle.net/georgeneil/cfrsj/5/ ] to demo the issue.

The scene have a red cube and a number of particle inside that cube. Here the steps to reproduce the issue.

1) Set the cube as invisible by unchecking the visible checkbox in the control pannel.

2) Rotate the cube

3) Increase the opacity via the opacity control in the pannel

4) Set the cube as visible.

Now the cube would have become completely opaque. I have observed that the issue is not consistent but used to occur most of the time for me.

Is this a bug in the API or is there any issue in my code ?

1
three.js

1 Answers

1
votes

Transparency is hit-and-miss in webGL. In your case, your transparent objects are competing with each other. One solution is to set the transparency of your particles to false in your shaderMaterial, so there is only the single transparent cube. Everything works in that case.

Fiddle: http://jsfiddle.net/cfrsj/6/