| | |
| | | import { FBXLoader } from 'three/examples/jsm/loaders/FBXLoader' |
| | | import * as Utils from '../../utils' |
| | | |
| | | const help = true; |
| | | const help = false; |
| | | |
| | | export default class ShelfThree { |
| | | |
| | |
| | | |
| | | initScene = () => { |
| | | const scene = new THREE.Scene(); |
| | | // scene.background = new THREE.Color(0xf0f0f0); |
| | | // scene.background = new THREE.Color(0x333333); |
| | | |
| | | // scene.background = new THREE.Color(0xf8f8f8); |
| | | scene.background = new THREE.Color(0x7a7a7a); |
| | | scene.fog = new THREE.Fog(scene.background, 1, 5000); |
| | |
| | | initControls = () => { |
| | | const controls = new OrbitControls(this.camera, this.renderer.domElement); |
| | | // controls.enableRotate = false; // 禁用整体旋转功能 |
| | | controls.enablePan = true; // 允许平移 |
| | | controls.enablePan = false; // 允许平移 |
| | | controls.enableDamping = true; // 开启阻尼 |
| | | controls.dampingFactor = 0.08; // 阻尼因子 |
| | | controls.enableZoom = true; // 允许缩放 |
| | | // controls.minDistance = 1; // 最小缩放距离 |
| | | // controls.maxDistance = 30; // 最大缩放距离 |
| | | controls.minPolarAngle = 0; // 最小俯仰角度(向下看) |
| | | // controls.minPolarAngle = Math.PI / 2.1; |
| | | controls.minPolarAngle = Math.PI / 2.1; |
| | | controls.maxPolarAngle = Math.PI / 2.1; // 最大俯仰角度(向上看) |
| | | controls.rotateSpeed = 0.6; // 视角移动速度减慢 |
| | | controls.autoRotate = true; // 自动旋转 |
| | |
| | | } |
| | | } |
| | | |
| | | rePerspective = (maxHeight) => { |
| | | const cameraPosScale = 0.7; |
| | | this.camera.position.set(-maxHeight * cameraPosScale, maxHeight * cameraPosScale, maxHeight * cameraPosScale); |
| | | this.controls.target = new THREE.Vector3(0, maxHeight * 0.53, 0); |
| | | } |
| | | |
| | | destroy = () => { |
| | | cancelAnimationFrame(this.animationFrame); |
| | | window.removeEventListener('resize', this.resizeHandler); |