Make three.js object invisible

Question

I have used the following code to create a mesh object

var defaultPartGeometry = new THREE.BoxGeometry(0.5, 0.5, 0.5);
var defaultPartMaterial = new THREE.MeshBasicMaterial({color: 0xff0000, wireframe: false});
default = new THREE.Mesh(defaultPartGeometry, defaultPartMaterial); 
default.position.set(0,0.25,0); 
scene.add(default)

How can I make this invisible? Setting the opacity for this object to null did not work.

I address the object by its ID and then try to set the opacity (I also have tried to address the material: object.material).

object = SceneService.scene.getObjectByName(ID);
tweens.push(tl.to(object, 2, { opacity: 0 }, e.time));

Tween the position is working:

tweens.push(tl.to(object.position, 2, { x: target.X, z: target.Y }, e.time));

EDIT:

object = SceneService.scene.getObjectByName(e.id);
object.transparent = true;
tweens.push(tl.to(object.position, 2, { x: target.X, z: target.Y }), e.time);
tweens.push(tl.to(object, 2, { opacity: 0 }), e.time);

Answer 1

You may have forgotten the transparent property :

object.material.transparent = true ;
TweenMax.to( object.material, duration, { opacity : 0 } );