|  |  | 
 |  |  |         this.stats.update(); | 
 |  |  |         // Rotate the scene | 
 |  |  |         this.controls.update() | 
 |  |  |         this.controls.autoRotateSpeed = 0.6; | 
 |  |  |         this.controls.autoRotateSpeed = 2; | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     addObject = (object) => { | 
 |  |  | 
 |  |  |  | 
 |  |  |     initCamera = () => { | 
 |  |  |         const camera = new THREE.PerspectiveCamera(70, this.fullWidth / this.fullHeight, 1, 60000); | 
 |  |  |         camera.position.set(200, 200, 200); | 
 |  |  |         camera.position.set(-300, 300, 300); | 
 |  |  |         this.scene.add(camera); | 
 |  |  |         return camera; | 
 |  |  |     } | 
 |  |  | 
 |  |  |     destroy = () => { | 
 |  |  |         cancelAnimationFrame(this.animationFrame); | 
 |  |  |         window.removeEventListener('resize', this.resizeHandler); | 
 |  |  |         this.renderer.dispose(); | 
 |  |  |         this.controls.dispose(); | 
 |  |  |         if (this.scene) { | 
 |  |  |             while (this.scene.children.length > 0) { | 
 |  |  |                 this.removeEntity(this.scene.children[0]); | 
 |  |  |             } | 
 |  |  |             this.scene = null; | 
 |  |  |         } | 
 |  |  |         if (this.renderer) { | 
 |  |  |             this.renderer.dispose(); | 
 |  |  |             this.renderer.forceContextLoss(); | 
 |  |  |             this.renderer.context = null; | 
 |  |  |             this.renderer.domElement = null; | 
 |  |  |             this.renderer = null; | 
 |  |  |         } | 
 |  |  |         if (this.controls) { | 
 |  |  |             this.controls.dispose(); | 
 |  |  |             this.controls = null; | 
 |  |  |         } | 
 |  |  |         this.camera = null; | 
 |  |  |         this.objects = []; | 
 |  |  |         while (this.dom?.firstChild) { | 
 |  |  |             this.dom.removeChild(this.dom.firstChild); | 
 |  |  |         } | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     removeEntity = (object) => { | 
 |  |  |         if (object.material) object.material.dispose(); | 
 |  |  |         if (object.geometry) object.geometry.dispose(); | 
 |  |  |         if (object.texture) object.texture.dispose(); | 
 |  |  |         this.scene.remove(object); | 
 |  |  |     } | 
 |  |  | }; | 
 |  |  |  | 
 |  |  | const initLight = (scene) => { | 
 |  |  |     const directionalLight = new THREE.DirectionalLight(0xffffff, 0.6); // 光颜色,强度 | 
 |  |  |     directionalLight.position.set(1, 1, 1).normalize(); | 
 |  |  |     const directionalLight = new THREE.DirectionalLight(0xffffff, 8); | 
 |  |  |     directionalLight.position.set(-300, 300, 300); | 
 |  |  |     scene.add(directionalLight); | 
 |  |  |  | 
 |  |  |     const ambientLight = new THREE.AmbientLight(0xf0f0f0, 3); | 
 |  |  |     const ambientLight = new THREE.AmbientLight(0xf0f0f0, 8); | 
 |  |  |     scene.add(ambientLight); | 
 |  |  |  | 
 |  |  |     const spotLight = new THREE.SpotLight(0xffffff, 8); | 
 |  |  |     spotLight.position.set(0, 1000, 0); | 
 |  |  |     spotLight.position.set(-300, 300, 0); | 
 |  |  |     spotLight.angle = Math.PI / 4;  // 角度 | 
 |  |  |     spotLight.distance = 1500;  // 距离 | 
 |  |  |     spotLight.distance = 800;  // 距离 | 
 |  |  |     spotLight.decay = 0;    // 光衰 | 
 |  |  |     // 光照阴影及其生效范围 | 
 |  |  |     spotLight.castShadow = true; | 
 |  |  | 
 |  |  |  | 
 |  |  | const buildDemo = (scene) => { | 
 |  |  |     const boxGeometry = new THREE.BoxGeometry(100, 100, 100); | 
 |  |  |     const boxMaterial = new THREE.MeshBasicMaterial({ color: 0x40739e }); | 
 |  |  |     const boxMaterial = new THREE.MeshStandardMaterial({ | 
 |  |  |         color: '#222f3e', | 
 |  |  |     }); | 
 |  |  |     const boxMesh = new THREE.Mesh(boxGeometry, boxMaterial); | 
 |  |  |     boxMesh.position.set(0, 0, 0); | 
 |  |  |     scene.add(boxMesh) |