OrbitControls

OrbitControls

3D虚拟工厂在线体验

描述

Orbit controls（轨道控制器）可以使得相机围绕目标进行轨道运动。

Constructor

OrbitControls( object : Camera, domElement : HTMLDOMElement )

参数	类型	描述
object	Camera	（必须）将要被控制的相机。该相机不允许是其他任何对象的子级，除非该对象是场景自身。
domElement	HTMLDOMElement	用于事件监听的HTML元素。

Events

事件名	描述
change	当摄像机被组件改变时触发。
start	初始化交互时触发。
end	当交互结束时触发。

属性

属性	类型	默认值	描述
.autoRotate	Boolean	false	设为true以自动围绕目标旋转。需在动画循环中调用.update()。
.autoRotateSpeed	Float	2.0	自动旋转的速度（60fps时每30秒转一圈）。需调用.update()。
.dampingFactor	Float	0.05	启用阻尼时的惯性大小。需调用.update()。
.domElement	HTMLDOMElement	-	用于监听事件的元素（必须在构造函数中传入）。
.enabled	Boolean	true	是否响应操作。
.enableDamping	Boolean	false	启用阻尼（惯性）效果。需调用.update()。
.enablePan	Boolean	true	是否启用平移。
.enableRotate	Boolean	true	是否启用旋转。
.enableZoom	Boolean	true	是否启用缩放。
.keyPanSpeed	Float	7	键盘平移速度（像素/按键）。
.keys	Object	方向键	控制平移的按键代码（默认使用四个方向键）。
.maxAzimuthAngle	Float	Infinity	水平旋转角度上限（弧度）。
.maxDistance	Float	Infinity	相机外移距离上限（仅PerspectiveCamera）。
.maxPolarAngle	Float	Math.PI	垂直旋转角度上限（0到π）。
.maxZoom	Float	Infinity	相机缩小上限（仅OrthographicCamera）。
.minAzimuthAngle	Float	-Infinity	水平旋转角度下限（弧度）。
.minDistance	Float	0	相机内移距离下限（仅PerspectiveCamera）。
.minPolarAngle	Float	0	垂直旋转角度下限（0到π）。
.minZoom	Float	0	相机放大下限（仅OrthographicCamera）。
.mouseButtons	Object	LEFT:旋转 MIDDLE:缩放 RIGHT:平移	鼠标按键功能映射。
.object	Camera	-	被控制的相机。
.panSpeed	Float	1	平移速度。
.position0	Vector3	-	内部状态存储（用于.reset()）。
.rotateSpeed	Float	1	旋转速度。
.screenSpacePanning	Boolean	true	是否在屏幕空间内平移。
.target0	Vector3	-	内部状态存储（用于.reset()）。
.target	Vector3	-	相机轨道围绕的目标点。
.touches	Object	ONE:旋转 TWO:缩放平移	触摸操作功能映射。
.zoom0	Float	-	内部状态存储（用于.reset()）。
.zoomSpeed	Float	1	缩放速度。
.zoomToCursor	Boolean	false	是否缩放到光标位置。

方法

方法	参数	返回值	描述
.dispose()	-	undefined	移除所有事件监听。
.getAzimuthalAngle()	-	radians	获取当前水平旋转弧度。
.getPolarAngle()	-	radians	获取当前垂直旋转弧度。
.getDistance()	-	Float	获取相机到目标的距离。
.listenToKeyEvents(domElement)	domElement: HTMLDOMElement	undefined	为指定元素添加按键监听（推荐window）。
.reset()	-	undefined	重置到上次保存的状态或初始状态。
.saveState()	-	undefined	保存当前控制器状态。
.stopListenToKeyEvents()	-	undefined	移除按键监听。
.update(deltaTime)	deltaTime: Number（可选）	Boolean	更新控制器。手动改变相机变换后必须调用；若启用自动旋转.autoRotate或阻尼.enableDamping，则需在更新循环中调用。可选参数deltaTime（秒）用于使自动旋转速度不受帧率影响。

例子

import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
const renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 10000 );
const controls = new OrbitControls( camera, renderer.domElement );
//controls.update() must be called after any manual changes to the camera's transform
camera.position.set( 0, 20, 100 );
controls.update();
function animate() {
	requestAnimationFrame( animate );
	// required if controls.enableDamping or controls.autoRotate are set to true
	controls.update();
	renderer.render( scene, camera );
}