|
@@ -2,7 +2,6 @@ import * as THREE from 'three'; //导入整个 three.js核心库
|
|
|
import {FBXLoader} from 'three/examples/jsm/loaders/FBXLoader';
|
|
|
import {OrbitControls} from 'three/examples/jsm/controls/OrbitControls'; //导入控制器模块,轨道控制器
|
|
|
import {CSS3DRenderer, CSS3DSprite} from 'three/examples/jsm/renderers/CSS3DRenderer.js';
|
|
|
-import {GUI} from 'three/examples/jsm/libs/lil-gui.module.min.js';
|
|
|
import * as TWEEN from '@tweenjs/tween.js';
|
|
|
import {getBottomMaterial} from './material.js';
|
|
|
|
|
@@ -53,8 +52,6 @@ class renderModel {
|
|
|
initScene() {
|
|
|
this.scene = new THREE.Scene();
|
|
|
this.scene.background = new THREE.Color(0x000000);
|
|
|
- const axesHelper = new THREE.AxesHelper(150);
|
|
|
- this.scene.add(axesHelper);
|
|
|
//底部平面
|
|
|
const geometry = new THREE.PlaneGeometry(1, 1);
|
|
|
// 创建材质,可以设置贴图
|
|
@@ -159,70 +156,6 @@ class renderModel {
|
|
|
this.renderer.setAnimationLoop(this.animate.bind(this));
|
|
|
}
|
|
|
|
|
|
- initGUI() {
|
|
|
- const gui = new GUI();
|
|
|
-
|
|
|
- // 添加控制器目标位置的控制器
|
|
|
- const controlsFolder = gui.addFolder('Controls Target');
|
|
|
- controlsFolder
|
|
|
- .add(this.controls.target, 'x', -1000, 1000)
|
|
|
- .name('Target X')
|
|
|
- .onChange(() => {
|
|
|
- this.controls.update();
|
|
|
- });
|
|
|
- controlsFolder
|
|
|
- .add(this.controls.target, 'y', -1000, 1000)
|
|
|
- .name('Target Y')
|
|
|
- .onChange(() => {
|
|
|
- this.controls.update();
|
|
|
- });
|
|
|
- controlsFolder
|
|
|
- .add(this.controls.target, 'z', -1000, 1000)
|
|
|
- .name('Target Z')
|
|
|
- .onChange(() => {
|
|
|
- this.controls.update();
|
|
|
- });
|
|
|
- controlsFolder.open();
|
|
|
-
|
|
|
- // 添加相机位置的控制器
|
|
|
- const cameraFolder = gui.addFolder('Camera Position');
|
|
|
- cameraFolder
|
|
|
- .add(this.camera.position, 'x', -1000, 1000)
|
|
|
- .name('Camera X')
|
|
|
- .onChange(() => {
|
|
|
- this.controls.update();
|
|
|
- });
|
|
|
- cameraFolder
|
|
|
- .add(this.camera.position, 'y', -1000, 1000)
|
|
|
- .name('Camera Y')
|
|
|
- .onChange(() => {
|
|
|
- this.controls.update();
|
|
|
- });
|
|
|
- cameraFolder
|
|
|
- .add(this.camera.position, 'z', -1000, 1000)
|
|
|
- .name('Camera Z')
|
|
|
- .onChange(() => {
|
|
|
- this.controls.update();
|
|
|
- });
|
|
|
- cameraFolder.open();
|
|
|
-
|
|
|
- // 添加重置按钮
|
|
|
- const initialTarget = this.controls.target.clone();
|
|
|
- const initialCameraPosition = this.camera.position.clone();
|
|
|
- gui
|
|
|
- .add(
|
|
|
- {
|
|
|
- reset: () => {
|
|
|
- this.controls.target.copy(initialTarget);
|
|
|
- this.camera.position.copy(initialCameraPosition);
|
|
|
- this.controls.update();
|
|
|
- }
|
|
|
- },
|
|
|
- 'reset'
|
|
|
- )
|
|
|
- .name('Reset Position');
|
|
|
- }
|
|
|
-
|
|
|
flyTo(target, scale = 1, duration = 1000) {
|
|
|
const targetPosition = new THREE.Vector3().copy(target.position);
|
|
|
const targetFocus = new THREE.Vector3().copy(target.targetContent);
|