CODEWITHSUNDEEP
javascript3dthree.js
user1058712
user1058712

Reputation: 417

Three.js set object opacity/transparent

I am creating a scene with some parts which are loaded from a JSON file. I can hide and show every single object. But now I want to set the opacity/transparent for a single object.

I creating the objects with this code.

    geometryArray = new Object();
    var loader = new THREE.JSONLoader();
    for(var i = 0; i < jsonFileNames.length; i++){
        var layerName = jsonFileNames[i].split("/")[1].slice(0, -5);
        loader.load(layerName, jsonFileNames[i], function(geometry, materials, layerName){
            mesh = new THREE.Mesh(geometry, new THREE.MeshLambertMaterial({vertexColors: THREE.FaceColors, side:THREE.DoubleSide, transparent: true}));
            mesh.scale.set(scaleFactor, scaleFactor, scaleFactor);
            mesh.name = layerName;
            scene.add(mesh);
            geometryArray[layerName] = mesh;
        }, layerName);
    }

And I can show/hide the objects with this code

geometryArray[layerName].visible = true;

But how can I set the opacity/transparent for an object?

I have tried to work with this code but this doesnt work.

geometryArray[layerName].materials[0].opacity

Upvotes: 2

Views: 3498

Answers (2)

Ravendra
Ravendra

Reputation: 9

material.transparent only accepts Boolean value not number value

WRONG !!!!! material.transparent = 0 or material.transparent = 1

RIGHT ------> material.transparent = true or material.transparent = false

Upvotes: -1

Bob Woodley
Bob Woodley

Reputation: 1304

You have to also set 

geometryArray[layerName].materials[0].transparent = true

on the material for it to use the opacity.

Upvotes: 2

Related Questions