threejs 相机OrbitControls常用方法及属性

相机控件OrbitControls

通过OrbitControls可以对三维场景进行缩放、平移、旋转，本质上改变的不是场景，而是相机的参数，相机的位置角度不同，同一个场景的渲染效果是不一样，比如相机围绕着一个场景旋转，就像场景旋转一样
调用OrbitControls时需要引入OrbitControls.js文件

import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js'

实现旋转缩放平移

controls = new OrbitControls(camera, renderer.domElement)

controls.enablePan =false;  // 禁止右键拖拽
controls.enableZoom =false; // 禁止缩放 默认true

通过.enableRotate属性可以控制是否允许鼠标左键旋转场景，.enableRotate属性默认值true。

controls.enableRotate =false; // 禁止旋转

设置缩放范围
在实际应用中，想控制一个产品缩放范围, 可以通过相机空间OrbitControls的.minZoom和.maxZoom属性实现

controls.minZoom = 0.5;
controls.maxZoom = 2;

设置旋转范围
展示一个三维场景，控制360度旋转范围，比如一辆轿车，不希望用户看到轿车的底盘，你可以通过设置相机的旋转范围属性来实现。
通过.minPolarAngle和.maxPolarAngle属性控制上下360度的旋转范围
通过.minAzimuthAngle和.maxAzimuthAngle属性控制左右360度的旋转范围
上下左右两个360度旋转也就是常说的720旋转展示。

// 上下旋转范围

controls.minPolarAngle =0;
controls.maxPolarAngle =Math.PI;

// 左右旋转范围

controls.minAzimuthAngle = -Math.PI * (100/180);
controls.maxAzimuthAngle =Math.PI * (100/180);

属性介绍

属性	类型	默认值	描述
autoRotate	Boolean	false	设定为true时， 相机自动围绕目标旋转但必须在animation中循环调用update()
enableDamping	Boolean	false	设置为true则启用阻尼(惯性),用来给控制相机一个重量，必须调用update()在你的animation循环中
dampingFactor	Float		enableDamping为true时使用阻尼惯性(可理解为阻止向一个方向移动)
enabled	Boolean	true	是否启用控件
enableKeys	Boolean	true	能否用键盘控制，←-↑-→↓四个键控制物体的移动
keys		四个箭头键{LEFT: 37,UP: 38,RIGHT: 39,DOWM:40}	Object控制相机平移的四个键
enablePan	Boolean	true	相机平移
panSpeed	Float	1	移动的速度
keyPanSpeed	Float	每按一次控制方向键移动7 .0像素	相机平移的速度
maxAzimuthAngle	Float	Infinity	水平旋转，范围-Math.PI~Math.PI 或者Infinity
maxPolarAngle	Float	-Infinity	水平旋转，范围-Math.PI~Math.PI 或者-Infinity
minAzimuthAngle	Float	Math.Pl	垂直旋转,范围0~Math.PI
minPolarAngle	Float	0	垂直旋转，范围0~Math.PI
maxDistance	Float	Infinity	拉远镜头(只能用在PerspectiveCamera)
minDistance	Float	0	拉近镜头
maxZoom	Float	Infinity	拉远镜头(只能用在Othorg[ aphicCamera)
minZoom	Float	Q	拉近镜头
zoomSpeed	Float	1	zoom(变焦)的速度

方法介绍

方法	描述
dispose()	null移除所有的事件监听
getAzimuthalAngle()	radians获得用弧度表示的当前水平旋转角度
getPolarAngle()	radians获得用弧度表示的当前垂直旋转角度
reset()	null通过最近1次调用saveState()或者 初始状态来重置为当前的状态
saveState()	null保存当前控制的状态,可以稍后通过reset()来恢复
update()	false更新控件,在手动改变了摄像机的钻换后必须调用。在设置了autoRotate或enableDamping时也要在循环中调用

该文引用于文章51CTO博客