CODEWITHSUNDEEP
javascripthtmlthree.jstextures
Matthew Anderson
Matthew Anderson

Reputation: 73

Use a texture and a color on a cube three.js

I would like to create a cube that has a texture and a color on it in three.js at the same time.

I want to change the color when the cube is selected. That's why it needs a color.

Will a black and white texture with a color on top allow me to change the color of the texture?

Upvotes: 3

Views: 8976

Answers (1)

Brakebein
Brakebein

Reputation: 2237

The color of a material has always an effect on the appearance of the object even there is an texture on it. The default color value is white and the texture looks just normal. But if you set the color to red, the texture will turn reddish (e.g. if you have a black/white texture, you will get a black/red texture).

var geometry = new THREE.BoxGeometry( 1, 1, 1 );
var material = new THREE.MeshLambertMaterial();  // default color is 0xffffff
var cube = new THREE.Mesh( geometry, material );
scene.add( cube );

var loader = new THREE.TextureLoader();
loader.load('texture.jpg',
    function ( texture ) {
        material.map: texture;
    });

// onclick: set color
material.color.set(0xff0000);

Upvotes: 4

Related Questions