当前位置: 首页 > news >正文

three.js——GUI的使用

GUI的使用

  • 效果图
  • 1、导入gui
  • 2、创建一个GUI对象
  • 3、通过gui调用方法 name:按钮的名称

效果图

在这里插入图片描述

1、导入gui

// 导入ligui
import { GUI } from 'three/examples/jsm/libs/lil-gui.module.min.js'

2、创建一个GUI对象

const gui = new GUI()

3、通过gui调用方法 name:按钮的名称

// 创建全屏函数
let eventObj = {Fullscreen: function () {// 全屏document.body.requestFullscreen()},ExitFullscreen: function () {// 退出全屏document.exitFullscreen()}
}
//创建按钮调用的函数
gui.add(eventObj, 'Fullscreen').name('全屏')
gui.add(eventObj, "ExitFullscreen").name('退出全屏')// 控制立方体的位置
let folder = gui.addFolder('立方体位置')
folder.add(cube.position, "x").min(-10).max(10).step(1).name('立方体x轴的位置').onChange((val) => {console.log(val)
})
folder.add(cube.position, 'y').min(-10).max(10).step(1).name('立方体y轴的位置').onFinishChange((val) => {console.log('移动结束')
})
folder.add(cube.position, 'z').min(-10).max(10).step(1).name('立方体z轴的位置')
http://www.lryc.cn/news/169993.html

相关文章:

  • LeetCode 332. Reconstruct Itinerary【欧拉回路,通路,DFS】困难
  • 236. 二叉树的最近公共祖先 Python
  • WPF中DataGrid控件绑定数据源
  • Linux arm64 set_memory_ro/rw函数
  • 安达发|APS排单软件中甘特图的应用
  • 快速上手Linux基础开发工具
  • 【开发工具】idea 的全局搜索快捷键(Ctrl+shift+F)失效
  • 港联证券:“火箭蛋”来袭 蛋价涨势能否延续?
  • Vue3_vite
  • python-字符串去掉空格的常见方法
  • 如何写出一个成熟的线上线下结合的营销方案?
  • Vc - Qt - “扩张“的窗口
  • vue学习-02vue入门之组件
  • 解决Pycharm使用Conda激活环境失败的问题
  • SpringSecurity 核心组件
  • 【Vue】快速入门和生命周期
  • JVM架构和内存管理优化
  • C语言——贪吃蛇小游戏
  • PHP8中获取并删除数组中第一个元素-PHP8知识详解
  • EtherCAT 总线型 4 轴电机控制卡解决方案
  • Upload-labs十六和十七关
  • 软件包的管理
  • 常见入门级进销存系统合集
  • 爬虫逆向实战(32)-某号店登录(RSA、补环境、混淆)
  • 正则表达式学习和高级用法
  • C# Onnx Yolov8 Fire Detect 火焰识别,火灾检测
  • 线程安全问题
  • 【力扣每日一题】2023.9.18 打家劫舍Ⅲ
  • Docker基础学习
  • esbuild中文文档-路径解析配置项(Path resolution - Alias、Conditions)