自学内容网 自学内容网

【Vue3+Tres 三维开发】02-Debug

预览

在这里插入图片描述

介绍

Debug 这里主要是讲在三维中的调试,同以前threejs中使用的lil-gui类似,TRESJS也提供了一套可视化参数调试的插件。使用方式和之前的组件相似。

使用

  • 通过导入useTweakPane 即可

    import { useTweakPane, OrbitControls } from "@tresjs/cientos"
    
    const { pane } = useTweakPane();
    
  • 创建分组和参数设置项

    const cameraFolder = pane.addFolder({ title: "Camera" });
    const cameraState = reactive({
      ...
      fov: 75,
      ...
    });
    
    const cameraFolder = pane.addFolder({ title: "Camera" });
    cameraFolder.addBinding(cameraState, "fov", {
      label: "fov",
      step: 1,
      min: 45,
      max: 85,
    });
    
  • 设置debug参数ÿ


原文地址:https://blog.csdn.net/seelingzheng/article/details/138206016

免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!