BJ Patel is an expert user of Umbraco. Always keen to share hints and tips on getting the best out of Umbraco.
Creating function showDirectionalLight() for realism effect in 3D
- Creating function showDirectionalLight() :
This function showDirectionalLight() sets up and adds a directional light source to a 3D scene using THREE.js. The light is white (0xFFFFFF) with an intensity of 1, positioned at (10, 20, 10) in the scene. Its target is set at the origin (0, 0, 0), indicating the direction it illuminates towards. Although directionalLight.castShadow is initially set to false, settings for shadow mapping are defined for higher quality: a map size of 2048x2048, and a perspective shadow camera with specific bounds and distances. After adding the light and its target are added to the scene, renderer.render(scene, camera) updates the scene with these lighting effects.
// Function to add a directional light to the scene
function showDirectionalLight() {
directionalLight = new THREE.DirectionalLight(0xFFFFFF, 1);
directionalLight.position.set(10, 20, 10);
directionalLight.target.position.set(0, 0, 0);
directionalLight.castShadow = false;
directionalLight.shadow.mapSize.width = 2048;
directionalLight.shadow.mapSize.height = 2048;
directionalLight.shadow.camera.left = -10;
directionalLight.shadow.camera.right = 10;
directionalLight.shadow.camera.top = 10;
directionalLight.shadow.camera.bottom = -6;
directionalLight.shadow.camera.near = 0.5;
directionalLight.shadow.camera.far = 500;
scene.add(directionalLight);
scene.add(directionalLight.target);
renderer.render(scene, camera);
}
comments powered by Disqus
Join Our Community
Join Our Community Become a part of our developer community. Share your projects, get feedback, and collaborate with like-minded individuals.
Your contributions help us continue creating valuable content. Consider supporting us by sharing our content.
Junagadh, Gujarat
Latest Blog Posts