I've been working on a simple solar system project using three.js. I've completed everything, but now I'm facing an issue with adding shading when working with textures.
loader.load("earth.jpg", function ( texture ) {
var geometry = new THREE.SphereGeometry( 100, 20, 20 ),
material = new THREE.MeshLambertMaterial({
map: texture,
overdraw: true,
}),
mesh = new THREE.Mesh( geometry, material );
group.add( mesh );
});
When I replace map: texture
with color: 0xffffff
, the rendering works perfectly. However, as soon as I try to add a texture, the lighting and shading effects seem to disappear.
Any ideas why the lights aren't interacting correctly with the textured surfaces?
Should I consider creating two separate spheres for each planet - one with a texture applied and another transparent sphere for shadows?