Second Sence
创立物体暗影
- 增加暗影须要给高空设置承受暗影的属性 receiveShadow
- 给几何体设置投射暗影的属性 castShadow
- 给可投射的光源设置投射暗影属性 castShadow
- 在 renderer 上设置暗影开启的属性 renderer.shadowMap.enabled
const scene = new THREE.Scene();// 创立高空const planeGeometry = new THREE.PlaneGeometry(300, 300, 30);const planeMaterial = new THREE.MeshPhonegMaterial({ color: 0xeeeeee,});const plane = new THREE.Mesh(planeGeometry, planeMaterial);plane.rotation.x = 0.5 * Math.PI;// 高空承受暗影plane.receiveShadow = true;scene.add(plane);// 创立几何体const boxGeometry = new THREE.BoxGeometry(20, 20, 20);const boxMaterial = new THREE.MeshPhongMaterial({ color: 0x277234,});const box = new THREE.Mesh(boxGeometry, boxMaterial);// 几何体投射暗影box.castShadow = true;box.position.y = 10;scene.add(box);// 创立点光源const point = new THREE.PointLight(0xaaaaaa);point.position.set(100, 100, 20);// 设置点光源的投射暗影point.castShadow = true;scene.add(point);// 创立环境光const ambient = new THREE.AmbientLight(0xcccccc);ambient.box;scene.add(ambient);// 创立相机var camera = new THREE.OrthographicCamera("未设置参数");camera.position.set(100, 100, 200);camera.lookAt(scene.position);// 创立renderer对象var renderer = new THREE.WebGLRenderer();renderer.setSize( window.document.body.clientWidth, window.document.body.clientHeight);renderer.setClearColor(0xb9d3ff, 1);// 开启暗影renderer.shadowMap.enabled = true;document.body.appendChild(renderer.domElement);renderer.render(scene, camera);