2

I'm using three.js and dat.gui to build an interface to modify the transparency of some loaded json objects.

I used all the needed options for the material creation: 

mesh = new THREE.Mesh(geometry, new THREE.MeshLambertMaterial( { 
                //map : texture,
                opacity:0.95,
                color: Math.random() * 0xffffff , 
                specular: 0x009900, 
                shininess: 0.2, 
                shading: THREE.SmoothShading,
                doubleSided:false,
                depthWrite:true,
                transparent: true,
                needsUpdate: true

            } ));

I'm able to modify opacity using dat.gui, but one of the object loaded seems to not have real transparency. Instead it leaves black holes on the surface of other objects when I set the opacity to 0.

I'll leave two screenshots.

https://i.stack.imgur.com/lxAZQ.png
https://i.stack.imgur.com/iWzch.png

Could you help me to understand how to resolve this problem?

Drew Gaynor
  • 8,292
  • 5
  • 40
  • 53
MauroD
  • 21
  • 3
  • can you leave just the necessary material attributes and see what happens i.e. `opacity`, `color` and `transparent`. – gaitat May 13 '15 at 19:56
  • nothing different. anyway, thanks gaitat for the answer. – MauroD May 14 '15 at 08:51
  • it seems that more info is needed. can you post the code of the `onChange()` call of dat.gui pertaining to this transparency setting? – gaitat May 14 '15 at 12:31
  • I found that the issue is not related to the dat.gui but is related to the z-depth. I found that the solution is to manage dynamically the mesh.renderOrder. I would like to thank you gaitat for your try and also thank WestLangley for all the useful messages that he left on stackoverflow about three.js and webgl. – MauroD May 15 '15 at 11:01

0 Answers0