import * as THREE from '../../build/three.module.js'; import { GLTFLoader } from '../jsm/loaders/GLTFLoader.js'; import { OrbitControls } from '../jsm/controls/OrbitControls.js'; let scene, camera, controls, renderer; const scenes = []; init(); animate(); function init() { const container = document.getElementById('content'); scene = new THREE.Scene(); camera = new THREE.PerspectiveCamera(50, 1, 1, 1000); camera.position.set(0, 2.5, 8); scene.userData.camera = camera; scene.background = new THREE.Color(0x15608c); const hemiLight = new THREE.HemisphereLight(0xffffff, 0x444444); hemiLight.position.set(0, 20, 0); scene.add(hemiLight); const spotLight = new THREE.SpotLight(0xffffff); spotLight.position.set(15, 40, 35); spotLight.castShadow = true; spotLight.intensity = 0.5; scene.add(spotLight); const spotLight2 = new THREE.SpotLight(0xffffff); spotLight2.position.set(15, 40, -35); spotLight2.castShadow = true; spotLight2.intensity = 0.5; scene.add(spotLight2); const dirLight = new THREE.DirectionalLight(0xffffff); dirLight.position.set(5, 5, 0); dirLight.castShadow = true; dirLight.shadow.camera.top = 1; dirLight.shadow.camera.bottom = -1; dirLight.shadow.camera.left = -1; dirLight.shadow.camera.right = 1; dirLight.shadow.camera.near = 0.1; dirLight.shadow.camera.far = 20; scene.add(dirLight); const mesh = new THREE.Mesh(new THREE.PlaneGeometry(50, 50), new THREE.MeshPhongMaterial({ color: 0x999999, depthWrite: false })); mesh.rotation.x = -Math.PI / 2; mesh.receiveShadow = true; scene.add(mesh); const grid = new THREE.GridHelper(50, 50, 0x888888, 0x888888); scene.add(grid); var loader = new GLTFLoader(); loader.setPath("./assets/glb/Revit元件/" + parent + "/"); loader.load(name + ".glb", function (gltf) { var mroot = gltf.scene; var bbox = new THREE.Box3().setFromObject(mroot); var cent = bbox.getCenter(new THREE.Vector3()); var size = bbox.getSize(new THREE.Vector3()); //Rescale the object to normalized space var maxAxis = Math.max(size.x, size.y, size.z); mroot.scale.multiplyScalar(5.0 / maxAxis); bbox.setFromObject(mroot); bbox.getCenter(cent); bbox.getSize(size); //Reposition to 0,halfY,0 mroot.position.copy(cent).multiplyScalar(-1); mroot.position.y += (size.y * 0.5); mroot.traverse(function (object) { if (object.isMesh) { object.castShadow = true; if (object.material.name == '玻璃') { object.material.transparent = true; object.material.opacity = 0; } } }); scene.add(mroot); }); scenes.push(scene); renderer = new THREE.WebGLRenderer({ antialias: true }); renderer.setClearColor(0xffffff, 1); renderer.setPixelRatio(window.devicePixelRatio); renderer.outputEncoding = THREE.sRGBEncoding; renderer.shadowMap.enabled = true; controls = new OrbitControls(camera, renderer.domElement); controls.target.set(0, 2, 0); controls.minDistance = 0.5; controls.maxDistance = 10; controls.maxPolarAngle = 0.5 * Math.PI; controls.autoRotate = true; scene.userData.controls = controls; container.appendChild(renderer.domElement); } function animate() { //render(); const canvas = renderer.domElement.parentNode.parentNode; const width = canvas.clientWidth; const height = canvas.clientHeight; if (canvas.width !== width || canvas.height !== width) { renderer.setSize(width-30, width-30, false); } renderer.render(scene, camera); controls.update(); requestAnimationFrame(animate); }