three的demo2

230 阅读1分钟

今天主要讲解相机控制器 他的作用是可以控制物体移动,缩小方法,翻滚等操作

下图是后期我们要做的一个成品展示

image.png

相机控制器:OrbitControls的引入

// 引入轨道控制器扩展库OrbitControls.js
import { OrbitControls } from "three/addons/controls/OrbitControls.js";

代码设置

// 设置相机控件轨道控制器OrbitControls
const controls = new OrbitControls(camera, renderer.domElement);
// 如果OrbitControls改变了相机参数,重新调用渲染器渲染三维场景
controls.addEventListener("change", function () {
  renderer.render(scene, camera); //执行渲染操作
}); //监听鼠标、键盘事件

大家可以集合上节内容操作下,模型是否可以缩放 移动 翻滚了,今天就先补充到这里吧