Well I just started learning three.js which is totally totally totally new to me. So I am writing these series of hello world kinda scrips.Well I wrote the script below to generate a cube with MeshBasicMaterial (Well this is just an exact copy of a tutorial given in a blog)
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(75, 640/340, 0.1, 1000);
var renderer = new THREE.WebGLRenderer();
renderer.setSize(640, 340);
document.body.appendChild(renderer.domElement);
var geometry = new THREE.CubeGeometry(1,1,1);
var material = new THREE.MeshBasicMaterial({color: 0xD43001});
var cube = new THREE.Mesh(geometry, material);
scene.add(cube);
camera.position.z = 5;
var render = function (){
requestAnimationFrame(render);
cube.rotation.x += 0.1;
cube.rotation.y += 0.1;
renderer.render(scene, camera);
};
render();
The script above generates a cube which rotates continuously now when I change the material of the cube from
var material = new THREE.MeshBasicMaterial({color: 0xD43001});
to
var material = new THREE.MeshLambertMaterial({color: 0xD43001});
nothing gets displayed. WHat exctly am I missing?
UPDATE
So i had to add a light source to display an object made out of mesh lambert material.When I added a point light the object got displayed.
This is because MeshBasicMaterial does not react to lighting but has a constant colour.
A MeshLambertMaterial however, does react to lighting, so without light, you cannot see it! The same goes for MeshPhongMaterial.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With