Appearance
控制器(废弃)
soonspacejs
的控制器是完全通过 属性配置 来约定如何工作的,因此用户可以灵活修改配置来自定义控制器特性。
修改配置的方式共有两种
- 场景初始配置项 controls。
- Api: setControlsOptions。
提示
v2.5.0
之后控制器新增了 type
属性用于切换不同类型的控制器
setControlsOptions
设置控制器配置
样例:
定义:
ts
type FreeControlsType = 'free';
type OrbitControlsType = 'orbit';
interface FreeControlsOptions {
type: FreeControlsType;
enabled?: boolean;
enabledMousePointInteractive?: boolean;
fallbackInteractivePosition?: Vector3 | null;
enableZoom?: boolean;
zoomSpeed?: number;
zoomMinDistance?: number;
zoomMaxDistance?: number;
zoomMinStepDistance?: number;
zoomMaxStepDistance?: number;
enableRotate?: boolean;
enableRotateX?: boolean;
enableRotateY?: boolean;
rotateSpeed?: number;
rotateTiltRange?: {
max: number;
min: number;
};
enableAutoRotate?: boolean;
autoRotateSpeed?: number;
autoRotateClockwise?: boolean;
enableOutOfScene?: boolean;
unOffsetOfScene?: number;
enablePan?: boolean;
enablePanX?: boolean;
enablePanY?: boolean;
enablePanAxisX?: boolean;
enablePanAxisY?: boolean;
enablePanAxisZ?: boolean;
panSpeed?: number;
}
interface OrbitControlsOptions {
type: OrbitControlsType;
enableAutoRotate?: boolean;
autoRotateSpeed?: number;
dampingFactor?: number;
enabled?: boolean;
enableDamping?: boolean;
enablePan?: boolean;
enableRotate?: boolean;
enableZoom?: boolean;
maxAzimuthAngle?: number;
maxDistance?: number;
maxPolarAngle?: number;
maxZoom?: number;
minAzimuthAngle?: number;
minDistance?: number;
minPolarAngle?: number;
minZoom?: number;
panSpeed?: number;
rotateSpeed?: number;
screenSpacePanning?: boolean;
target?: Vector3;
zoomSpeed?: number;
}
type ControlsOptions = FreeControlsOptions | OrbitControlsOptions;
function setControlsOptions(options: ControlsOptions): void;
用法:
js
ssp.setControlsOptions({
type: 'orbit',
enableDamping: true,
});
参数:
options
- 描述: 模型对象
- 类型: ControlsOptions
- 必填:
ControlsOptions
属性 | 描述 | 类型 | 必填 | 默认值 |
---|---|---|---|---|
type | 控制器类型 | free | orbit | free |
FreeControlsOptions
属性 | 描述 | 类型 | 必填 | 默认值 |
---|---|---|---|---|
enabled | 启用控制器 | boolean | true | |
enabledMousePointInteractive | 开启鼠标对象相交检测 | boolean | true | |
fallbackInteractivePosition | 开启鼠标对象相交检测时,没有相交对象的备用点 | Vector3 | {x:0,y:0,z:0} | |
enableZoom | 开启缩放 | boolean | true | |
zoomSpeed | 缩放速度 | number | 1 | |
zoomMinDistance | 缩放最小距离 | number | 50 | |
zoomMaxDistance | 缩放最大距离 | number | 100000 | |
zoomMinStepDistance | 单步缩放最小距离 | number | 5 | |
zoomMaxStepDistance | 单步缩放最大距离 | number | 20000 | |
enableRotate | 开启旋转 | boolean | true | |
enableRotateX | 开启屏幕水平旋转 | boolean | true | |
enableRotateY | 开启屏幕垂直旋转 | boolean | true | |
rotateSpeed | 旋转速度 | number | 1 | |
rotateTiltRange | 旋转倾斜范围 | object | { "max": 3.141592653589793, "min": 0 } | |
enablePan | 开启移动 | boolean | true | |
enablePanX | 开启屏幕水平移动 | boolean | true | |
enablePanY | 开启屏幕垂直移动 | boolean | true | |
enablePanAxisX | 开启空间 X 轴 移动 | boolean | true | |
enablePanAxisY | 开启空间 Y 轴 移动 | boolean | true | |
enablePanAxisZ | 开启空间 Z 轴 移动 | boolean | true | |
enableAutoRotate | 开启自动旋转 | boolean | false | |
panSpeed | 移动速度 | number | 2 | |
autoRotateSpeed | 自动旋转速度 | number | 1 | |
autoRotateClockwise | 自动旋转顺时针 | boolean | true |
OrbitControlsOptions
属性 | 描述 | 类型 | 必填 | 默认值 |
---|---|---|---|---|
enabled | 启用控制器 | boolean | true | |
enableAutoRotate | 开启自动旋转 | boolean | false | |
autoRotateSpeed | 自动旋转速度 | number | 1 | |
dampingFactor | 阻尼系数 | number | 0.05 | |
enableDamping | 启用阻尼效果 | boolean | false | |
enablePan | 开启移动 | boolean | true | |
enableRotate | 开启旋转 | boolean | true | |
enableZoom | 开启缩放 | boolean | true | |
maxAzimuthAngle | 最大水平角度 | number | Infinity | |
minAzimuthAngle | 最小水平角度 | number | -Infinity | |
maxDistance | 最远滚动距离 | number | Infinity | |
minDistance | 最小滚动距离 | number | 0 | |
maxPolarAngle | 最大垂直角度 | number | Math.PI | |
minPolarAngle | 最小垂直角度 | number | 0 | |
maxZoom | 最大缩放距离(适用于正交相机) | number | Infinity | |
minZoom | 最小缩放距离(适用于正交相机) | number | 0 | |
panSpeed | 移动速度 | number | 1 | |
rotateSpeed | 旋转速度 | number | 1 | |
zoomSpeed | 缩放速度 | number | 1 | |
screenSpacePanning | 上下拖动时,相机垂直还是相对于 y 轴正交移动 | boolean | true | |
target | 控制器内部维护的相机的朝向点,也可以手动设置。 | Vector3 | {x:0,y:0,z:0} |
注意
在使用 orbit
控制器时,相机的 rotation
无法直接修改。
请通过设置 target
来控制相机的 rotation