I'm a newcomer to three.js and I've been experimenting with r55. I tried adding lights to my project by following Mrdoob's documentation, specifically using DirectionalLight. However, I'm facing an issue where the light doesn't show up despite adding shadowCameraVisible for debugging purposes. Can anyone provide insight on what might be going wrong with my code? Any help is appreciated!
function initialize() {
container = document.createElement('div');
document.body.appendChild(container);
scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
container.appendChild(renderer.domElement);
// Creating a cube
var material = new THREE.MeshBasicMaterial({
color: 0xff0000
});
var geometry = new THREE.CubeGeometry(x, y, z);
cube = new THREE.Mesh(geometry, material);
cube.position.z = z / 2;
scene.add(cube);
// Creating a floor
var floorMaterial = new THREE.MeshBasicMaterial({
color: 0xcccccc
});
var floorGeometry = new THREE.PlaneGeometry(20, 20, 1, 1);
var floor = new THREE.Mesh(floorGeometry, floorMaterial);
floor.position.y = -0.5;
floor.doubleSided = true;
scene.add(floor);
// Adding lights
var dLight = new THREE.DirectionalLight(0xffffff);
dLight.position.set(0, 0, 1);
dLight.shadowCameraVisible = true;
dLight.shadowCameraNear = 1;
dLight.shadowCameraFar = 150;
dLight.castshadow = true;
scene.add(dLight);
// Setting camera position
camera.position.z = 50;
controls = new THREE.TrackballControls(camera);
renderer.shadowMapEnabled = true;
renderer.shadowMapType = THREE.PCFShadowMap;
}