DT走过的路

安装

https://www.npmjs.com/package/dat.gui
pnpm add dat.gui
pnpm add @types/dat.gui -D

简单使用

// CommonJS:
const dat = require('dat.gui');

// ES6:
import * as dat from 'dat.gui';

const gui = new dat.GUI();

//图形化控制
const gui = new dat.GUI();
gui.add(box.position, 'x').name("移动x轴").min(-10).max(10).step(0.1);
gui.add(box.position, 'y').name("移动y轴").min(-10).max(10).step(0.1);
gui.add(box.position, 'z').name("移动z轴").min(-10).max(10).step(0.1);
gui.addColor({color: 0x00ff00}, 'color').name("修改颜色").onChange( (value)=> {
    box.material.color = new THREE.Color(value);
});

//可选
boxFolder.add(params, 'visible').name("是否可见").onChange( (e)=> {
  box.visible = e;
});
boxFolder.add(params, 'moveAnimation').name("移动");

const cameraFolder = gui.addFolder('相机');
cameraFolder.open();
cameraFolder.add(camera.position, 'x').name("相机x轴").min(-5).max(5).step(0.01);
cameraFolder.add(camera.position, 'y').name("相机y轴").min(-5).max(5).step(0.01);
cameraFolder.add(camera.position, 'z').name("相机z轴").min(-5).max(5).step(0.01);