indoorcontrols
v1.1.1
Published
edit from orbitControls in threejs, its just for panorama view for no changing camera position
Downloads
28
Maintainers
Readme
Description
This controls is edited from orbitControls from threejs.
- This controls can be used for exploring paranoma sphere, pointcloud, 3D models, also can be used for walking
- Mouse left rotates camera view (camera not moving), Mouse middle moves into viewspace (point moving), Mouse right translates camera position
- This controls will rotate like drag or catch the point when hold left click, and will be influenced by camera fov.
- This controls doesnot suit for mobile(may future), only for PC now
Using Guide
You need threejs to use this, then install it
npm i indoorcontrols
import * as THREE from 'three'
import { IndoorControls } from 'indoorcontrols'
const controls = new IndoorControls(camera, renderer.domElement)
const clock = new THREE.Clock()
...
render(){
...
controls.update(clock.getDelta())
...
}
Document
The damping has changed to make the rotate move the position smoothly And it is enabled default. The dampingFactor will be useful when it decrease(but 10 is better)
controls.enableDamping = true
controls.dampingFactor = 10
To make move from screenspace,so this is true in default
controls.screenSpacePanning = true
说明
室内或室外中使用的 Controls
根据 threejs 的 orbitControls 更改而来
- 该 Controls 用于同时浏览全景球,浏览点云或模型,也可用于路人行走等场景
- 左键旋转视角(不动相机位置),中键按屏幕点移动,右键平移(按屏幕)
- 该 Controls 在旋转时会让物体跟随鼠标旋转,类似于抓手或手型工具(在边缘会有畸变)
- 暂时只对 pc 版改动, 未对移动改动
使用
import * as THREE from 'three'
import { IndoorControls } from 'indoorcontrols'
const controls = new IndoorControls(camera, renderer.domElement)
const clock = new THREE.Clock()
...
render(){
...
controls.update(clock.getDelta())
...
}
文档
阻尼的作用被改为仅让移动顺滑而不影响实际的移动效果,并默认开启.阻尼系数减少时会明显效果,但 10 是比较好的
controls.enableDamping = true
controls.dampingFactor = 10
为了让平移为屏幕空间移动,默认开启
controls.screenSpacePanning = true