writer, web developer, designer

From the Blog

When creating an object we can colour it. A notes that I found useful:

cube = new THREE.Mesh( cubeGeo, new THREE.MeshLambertMaterial({ color: Math.random() * 0xffffff, opacity: 0.9, transparent: true }) );
									

Math.random() * 0xffffff generates a random colour

opacity sets the opacity level for the surfaces within our cube. For example, the you can see ‘into’ the cube through its surfaces, but other objects that are behind your cube will not be visible.

transparent:true will apply your the opacity to the entire cube. Other objects in the scene will be visible through the cube.

I’ve also seen this technique for applying a material directly to each side of a cube:

for ( var i = 0; i < 6; i ++ ) {
        materials.push( new THREE.MeshPhongMaterial( {
            color: 0x9CDB79,
            opacity: 0.5
        } ) );
    }

cube = new THREE.Mesh( new THREE.CubeGeometry( cubeSize, cubeSize, cubeSize, 1, 1, 1, materials ), new THREE.MeshFaceMaterial() );
        
									

…however it causes horrific flickering in Google Chrome. Probably best to avoid.