Interface FiveInjectionTypes

interface FiveInjectionTypes {
    cameraDirection: any;
    cameraRaycaster: any;
    currentObserver: any;
    currentState: State;
    getPixels: (<T>(x: number, y: number, width: number, height: number, pixelRatio?: number, flipY?: boolean, buffer?: T) => T);
    helperVisible: any;
    initBasisLoader: any;
    intersectRaycaster: ((raycaster: Raycaster, floor?: number, sortByDistance?: boolean) => Intersection[]);
    loadWork: ((inputWork:
        | string
        | string[]
        | LooseWork
        | Work
        | Work[]
        | LooseWork[]
        | LooseWorkWithExtrinsics[]
        | Promise<
            | LooseWork
            | Work
            | Work[]
            | LooseWork[]
            | LooseWorkWithExtrinsics[]>, state?: "initial" | Partial<State> | "inherit", options?: number | FiveLoadOptions, userAction?: boolean) => Promise<void>);
    model: any;
    modelReadyState: any;
    needsRender: (() => void);
    off: (<K>(name?: K, callback?: ((...args: Parameters<EventTypes[K]>) => ReturnType<EventTypes[K]>)) => void);
    on: (<K>(name: K, callback: ((...args: Parameters<EventTypes[K]>) => ReturnType<EventTypes[K]>), once?: boolean) => (() => void));
    once: (<K>(name: K, callback: ((...args: Parameters<EventTypes[K]>) => ReturnType<EventTypes[K]>)) => (() => void));
    preloadPano: ((pano: number | Pano | `${string}[${number}]`, callback?: ((costs: number) => void)) => Promise<number>);
    project2d: ((vector: Vector3, testModel?: boolean) => Vector2);
    render: ((callback?: (() => void), updateObjectResolution?: boolean) => any);
    scene: any;
    setState: ((state: Partial<State>, immediately?: boolean, userAction?: boolean) => void);
    showFloor: ((floorIndex?: number) => void);
    shownFloor: any;
    state: State;
    toggleHelperVisible: ((visible: boolean) => void);
    totalFloorLength: any;
    unsafe__fiveInstance: Five;
    updateCamera: ((pose: Partial<Pose>, duration: number, userAction?: boolean) => Promise<void>);
    works: Works;
}

Hierarchy

Record<FiveInjectionFeature, any>
- FiveInjectionTypes

Properties

cameraDirection

cameraDirection: any

cameraRaycaster

cameraRaycaster: any

currentObserver

currentObserver: any

currentState

currentState: State

Five React Inject: Five 的当前状态

Description

five 设置了以下状态

- mode: Mode
- panoId: string
- panoIndex: number
- longitude: number
- latitude: number
- fov: number
- offset: THREE.Vector3

可以通过 state, currentState 和 setState 来获取和设置。
通过 state 设置后，five 会通过合适的动画运动来达到设置的位置。
来迎合一些通过数据驱动的场景。

getPixels

getPixels: (<T>(x: number, y: number, width: number, height: number, pixelRatio?: number, flipY?: boolean, buffer?: T) => T)

获取画面中的像素颜色

Type declaration

- <T>(x, y, width, height, pixelRatio?, flipY?, buffer?): T
- 获取画面中的像素颜色
  Type Parameters
  - T extends Uint8Array | Uint8ClampedArray = Uint8Array
  Parameters
  - x: number
    获取像素区域的起始坐标 x
  - y: number
    获取像素区域的起始坐标 y
  - width: number
    获取像素区域的宽度
  - height: number
    获取像素区域的高度
  - OptionalpixelRatio: number
    获取区域的像素比
  - OptionalflipY: boolean
    是否Y轴翻转
  - Optionalbuffer: T
    存储数组
  Returns T
  rgba颜色平铺的 Uint8Array

Param: x

获取像素区域的起始坐标 x

Param: y

获取像素区域的起始坐标 y

Param: width

获取像素区域的宽度

Param: height

获取像素区域的高度

Param: pixelRatio

获取区域的像素比

Returns

rgba颜色平铺的 Uint8Array

helperVisible

helperVisible: any

initBasisLoader

initBasisLoader: any

intersectRaycaster

intersectRaycaster: ((raycaster: Raycaster, floor?: number, sortByDistance?: boolean) => Intersection[])

计算模型射线碰撞检测

Type declaration

- (raycaster, floor?, sortByDistance?): Intersection[]
- 计算模型射线碰撞检测
  Parameters
  - raycaster: Raycaster
    THREE 射线对象
  - floor: number = null
    和某一楼层做碰撞检测，不传为和所有楼层做碰撞检测
  - sortByDistance: boolean = true
  Returns Intersection[]
  返回碰撞

Param: raycaster

THREE 射线对象

Param: floor

和某一楼层做碰撞检测，不传为和所有楼层做碰撞检测

Returns

返回碰撞

loadWork

加载 Work 数据

Type declaration

- (inputWork, state?, options?, userAction?): Promise<void>
- 加载 Work 数据
  Parameters
  - inputWork:
        | string
        | string[]
        | LooseWork
        | Work
        | Work[]
        | LooseWork[]
        | LooseWorkWithExtrinsics[]
        | Promise<
            | LooseWork
            | Work
            | Work[]
            | LooseWork[]
            | LooseWorkWithExtrinsics[]>
    Work 数据
  - Optionalstate: "initial" | Partial<State> | "inherit"
    初始化姿态
    
    "inherit" 使用当前姿态
    
    "initial" 使用 Work 数据中的 initial 姿态
    
    State 自定义姿态
  - Optionaloptions: number | FiveLoadOptions
    切换时间, 切换效果
  - userAction: boolean = true
  Returns Promise<void>

Param: inputWork

Work 数据

Param: state

初始化姿态

"inherit" 使用当前姿态
"initial" 使用 Work 数据中的 initial 姿态
State 自定义姿态

Param: duration

切换时间

model

model: any

modelReadyState

modelReadyState: any

needsRender

needsRender: (() => void)

下一帧渲染

Description

调用 render() 和设置 needsRender() 均可在按需渲染时，使得画面渲染一次区别在于：

needsRender() 为在下帧渲染画面
render() 在当前帧渲染画面推荐使用 needsRender(), 可以更加流畅。但是如果需要截图等同步操作，可以使用 render()

off

off: (<K>(name?: K, callback?: ((...args: Parameters<EventTypes[K]>) => ReturnType<EventTypes[K]>)) => void)

解除事件绑定

Type declaration

- <K>(name?, callback?): void
- 解除事件
  
  如果 name 不传的话解除对应所有事件如果 name, callback 不传的话解除所有name的所有事件
  Type Parameters
  - K extends
        | "error"
        | "dispose"
        | "gesture.pan"
        | "gesture.tap"
        | "gesture.dbltap"
        | "gesture.press"
        | "gesture.pinch"
        | "gesture.mousewheel"
        | "gesture.mousemove"
        | "gesture.momentum"
        | "initAnimation.start"
        | "initAnimation.end"
        | "camera.update"
        | "intersect.update"
        | "pano.select"
        | "pano.request"
        | "pano.moveTo"
        | "pano.moving"
        | "pano.arrived"
        | "pano.cancel"
        | "pano.error"
        | "pano.texture.load"
        | "pano.texture.progress"
        | "pano.texture.success"
        | "pano.texture.error"
        | "pano.texture.abort"
        | "xr.session.end"
        | "xr.session.start"
        | "xr.gesture.tap"
        | "xr.gesture.press"
        | "xr.gesture.buttonUp"
        | "xr.gesture.buttonDown"
        | "xr.controller.update"
        | (keyof LegacyEventType)
        | "works.request"
        | "works.load"
        | "works.ready"
        | "state.set"
        | "state.change"
        | "state.synced"
        | "currentState.change"
        | "model.request"
        | "model.load"
        | "model.error"
        | "model.changeShownFloor"
        | "models.load"
        | "models.refined"
        | "render.prepare"
        | "render"
        | "mode.change.request"
        | "mode.change"
        | "helpers.visible"
        | "network.resource"
        | "fps"
    预设的监听事件名称
  Parameters
  - Optionalname: K
    事件类型
  - Optionalcallback: ((...args: Parameters<EventTypes[K]>) => ReturnType<EventTypes[K]>)
    事件回调函数
    - (...args): ReturnType<EventTypes[K]>
      Parameters
      Rest...args: Parameters<EventTypes[K]>
      Returns ReturnType<EventTypes[K]>
  Returns void

Param: name

事件名具体事件列表请查看 Five.EventCallback

Param: callback

回调函数

Example

$five.off("panoArrived", () => {});

on

on: (<K>(name: K, callback: ((...args: Parameters<EventTypes[K]>) => ReturnType<EventTypes[K]>), once?: boolean) => (() => void))

监听事件

Type declaration

- <K>(name, callback, once?): (() => void)
- 注册事件
  Type Parameters
  - K extends
        | "error"
        | "dispose"
        | "gesture.pan"
        | "gesture.tap"
        | "gesture.dbltap"
        | "gesture.press"
        | "gesture.pinch"
        | "gesture.mousewheel"
        | "gesture.mousemove"
        | "gesture.momentum"
        | "initAnimation.start"
        | "initAnimation.end"
        | "camera.update"
        | "intersect.update"
        | "pano.select"
        | "pano.request"
        | "pano.moveTo"
        | "pano.moving"
        | "pano.arrived"
        | "pano.cancel"
        | "pano.error"
        | "pano.texture.load"
        | "pano.texture.progress"
        | "pano.texture.success"
        | "pano.texture.error"
        | "pano.texture.abort"
        | "xr.session.end"
        | "xr.session.start"
        | "xr.gesture.tap"
        | "xr.gesture.press"
        | "xr.gesture.buttonUp"
        | "xr.gesture.buttonDown"
        | "xr.controller.update"
        | (keyof LegacyEventType)
        | "works.request"
        | "works.load"
        | "works.ready"
        | "state.set"
        | "state.change"
        | "state.synced"
        | "currentState.change"
        | "model.request"
        | "model.load"
        | "model.error"
        | "model.changeShownFloor"
        | "models.load"
        | "models.refined"
        | "render.prepare"
        | "render"
        | "mode.change.request"
        | "mode.change"
        | "helpers.visible"
        | "network.resource"
        | "fps"
    预设的监听事件名称
  Parameters
  - name: K
    事件类型
  - callback: ((...args: Parameters<EventTypes[K]>) => ReturnType<EventTypes[K]>)
    事件回调函数
    - (...args): ReturnType<EventTypes[K]>
      Parameters
      Rest...args: Parameters<EventTypes[K]>
      Returns ReturnType<EventTypes[K]>
  - Optionalonce: boolean
    是否只执行一次
  Returns (() => void)
  解除事件
  - - (): void
    - Returns void

Param: name

事件名具体事件列表请查看 Five.EventCallback

Param: callback

回调函数

Param: once

是否一次触发

Returns

解除事件绑定

Example

$five.on("panoArrived", () => {});

once

once: (<K>(name: K, callback: ((...args: Parameters<EventTypes[K]>) => ReturnType<EventTypes[K]>)) => (() => void))

监听事件一次触发

Type declaration

- <K>(name, callback): (() => void)
- 注册事件(是否只执行一次)
  Type Parameters
  - K extends
        | "error"
        | "dispose"
        | "gesture.pan"
        | "gesture.tap"
        | "gesture.dbltap"
        | "gesture.press"
        | "gesture.pinch"
        | "gesture.mousewheel"
        | "gesture.mousemove"
        | "gesture.momentum"
        | "initAnimation.start"
        | "initAnimation.end"
        | "camera.update"
        | "intersect.update"
        | "pano.select"
        | "pano.request"
        | "pano.moveTo"
        | "pano.moving"
        | "pano.arrived"
        | "pano.cancel"
        | "pano.error"
        | "pano.texture.load"
        | "pano.texture.progress"
        | "pano.texture.success"
        | "pano.texture.error"
        | "pano.texture.abort"
        | "xr.session.end"
        | "xr.session.start"
        | "xr.gesture.tap"
        | "xr.gesture.press"
        | "xr.gesture.buttonUp"
        | "xr.gesture.buttonDown"
        | "xr.controller.update"
        | (keyof LegacyEventType)
        | "works.request"
        | "works.load"
        | "works.ready"
        | "state.set"
        | "state.change"
        | "state.synced"
        | "currentState.change"
        | "model.request"
        | "model.load"
        | "model.error"
        | "model.changeShownFloor"
        | "models.load"
        | "models.refined"
        | "render.prepare"
        | "render"
        | "mode.change.request"
        | "mode.change"
        | "helpers.visible"
        | "network.resource"
        | "fps"
    预设的监听事件名称
  Parameters
  - name: K
    事件类型
  - callback: ((...args: Parameters<EventTypes[K]>) => ReturnType<EventTypes[K]>)
    事件回调函数
    - (...args): ReturnType<EventTypes[K]>
      Parameters
      Rest...args: Parameters<EventTypes[K]>
      Returns ReturnType<EventTypes[K]>
  Returns (() => void)
  解除事件
  - - (): void
    - Returns void

Param: name

事件名具体事件列表请查看 Five.EventCallback

Param: callback

回调函数

Returns

解除事件绑定

Example

$five.once("panoArrived", () => {});

preloadPano

preloadPano: ((pano: number | Pano | `${string}[${number}]`, callback?: ((costs: number) => void)) => Promise<number>)

预加载点位图片资源

Type declaration

- (pano, callback?): Promise<number>
- 预加载点位图片资源
  Parameters
  - pano: number | Pano | `${string}[${number}]`
    观察点序号
  - callback: ((costs: number) => void) = noop
    加载完成回调, 并传递加载用时。
    - (costs): void
      Parameters
      costs: number
      Returns void
  Returns Promise<number>
  加载完成的 Promise 参数同 callback

Param: panoId

观察点

Param: callback

加载完成回调, 并传递加载用时。

Returns

加载完成的 Promise 参数同 callback

project2d

project2d: ((vector: Vector3, testModel?: boolean) => Vector2)

计算三维坐标对应到屏幕的二维坐标

Type declaration

- (vector, testModel?): Vector2
- 计算三维坐标对应到屏幕的二维坐标
  Parameters
  - vector: Vector3
    三维坐标
  - testModel: boolean = false
    是否计算模型遮挡
  Returns Vector2
  二维坐标或者 null
  
  Description
  如果三维坐标不在屏幕中，则返回 null

Description

如果三维坐标不在屏幕中，则返回 null

Param: vector

三维坐标

Param: testModel

是否计算模型遮挡

Returns

二维坐标或者 null

render

render: ((callback?: (() => void), updateObjectResolution?: boolean) => any)

强制渲染

Type declaration

- (callback?, updateObjectResolution?): any
- 强制渲染
  Parameters
  - Optionalcallback: (() => void)
    渲染完成回调
    - (): void
      Returns void
  - updateObjectResolution: boolean = false
  Returns any
  Description
  调用 five.render() 和设置 five.needsRender = true 均可在按需渲染时，使得画面渲染一次区别在于：
  - five.needsRender = true 为在下帧渲染画面
  - five.render() 在当前帧渲染画面推荐使用 five.needsRender = true, 可以更加流畅。但是如果需要截图等同步操作，可以使用 five.render()

Description

调用 render() 和设置 needsRender() 均可在按需渲染时，使得画面渲染一次区别在于：

needsRender() 为在下帧渲染画面
render() 在当前帧渲染画面推荐使用 needsRender(), 可以更加流畅。但是如果需要截图等同步操作，可以使用 render()

Param: callback

渲染完成回调

scene

scene: any

setState

setState: ((state: Partial<State>, immediately?: boolean, userAction?: boolean) => void)

设置 State

Type declaration

(state, immediately?, userAction?): void

设置 State

Parameters

state: Partial<State>
目标状态
immediately: boolean = false
是否马上转换，马上转换会尽快达到目标状态，尽量减少中间状态，更少动画。
userAction: boolean = true
是否是用户触发的动作

Returns void

Description

five 设置了以下状态

- mode: Mode
- panoIndex: number
- longitude: number
- latitude: number
- fov: number
- offset: THREE.Vector3

可以通过 five.state 和 five.setState 来获取和设置。
通过 state 设置后，five 会通过合适的动画运动来达到设置的位置。
来迎合一些通过数据驱动的场景。

Description

five 设置了以下状态

- mode: Mode
- panoId: string
- panoIndex: number
- longitude: number
- latitude: number
- fov: number
- offset: THREE.Vector3

可以通过 state, currentState 和 setState 来获取和设置。
通过 state 设置后，five 会通过合适的动画运动来达到设置的位置。
来迎合一些通过数据驱动的场景。

Param: state

目标状态

Param: immediately

是否马上转换，马上转换会尽快达到目标状态，尽量减少中间状态，更少动画。

showFloor

showFloor: ((floorIndex?: number) => void)

显示楼层

Type declaration

- (floorIndex?): void
- Parameters
  - OptionalfloorIndex: number
    楼层，如果不传则都显示
  Returns void

shownFloor

shownFloor: any

state

state: State

Five React Inject: Five 的目标状态

Description

five 设置了以下状态

- mode: Mode
- panoId: string
- panoIndex: number
- longitude: number
- latitude: number
- fov: number
- offset: THREE.Vector3

可以通过 state, currentState 和 setState 来获取和设置。
通过 state 设置后，five 会通过合适的动画运动来达到设置的位置。
来迎合一些通过数据驱动的场景。

toggleHelperVisible

toggleHelperVisible: ((visible: boolean) => void)

帮助元素的隐藏/显示

Type declaration

- (visible): void
- Parameters
  - visible: boolean
    隐藏/显示
  Returns void

totalFloorLength

totalFloorLength: any

unsafe__fiveInstance

unsafe__fiveInstance: Five

Five React Inject: 获取 five 实例

Description

不到万不得已，并不推荐直接使用。

Deprecated

不到万不得已，并不推荐直接使用。

updateCamera

updateCamera: ((pose: Partial<Pose>, duration: number, userAction?: boolean) => Promise<void>)

移动相机。（不触发点位移动）

Type declaration

- (pose, duration, userAction?): Promise<void>
- 移动相机。（不触发点位移动）
  Parameters
  - pose: Partial<Pose>
    相机目标位置
  - duration: number
    动画触发的时常
  - userAction: boolean = true
    是否用户触发
  Returns Promise<void>
  Promise 是否移动成功
  
  Description
  如果动画中途被打断（用户触发行为，或者调用 setState, load, changeMode）的等会 Promise.reject。运动完成则 Promise.resolve

Description

如果动画中途被打断（用户触发行为，或者调用 setState, load, changeMode）的等会 Promise.reject。运动完成则 Promise.resolve

Param: pose

相机目标位置

Param: duration

动画触发的时常

Returns

Promise 是否移动成功

works

works: Works

Five React Inject: Five Work

Interface FiveInjectionTypes

Hierarchy

Index

Properties

Properties

cameraDirection

cameraRaycaster

currentObserver

currentState

Description

getPixels

Type declaration

Type Parameters

Parameters

Returns T

Param: x

Param: y

Param: width

Param: height

Param: pixelRatio

Returns

helperVisible

initBasisLoader

intersectRaycaster

Type declaration

Parameters

Returns Intersection[]

Param: raycaster

Param: floor

Returns

loadWork

Type declaration

Parameters

Returns Promise<void>

Param: inputWork

Param: state

Param: duration

model

modelReadyState

needsRender

Description

off

Type declaration

Type Parameters

Parameters

Parameters

Returns ReturnType<EventTypes[K]>

Returns void

Param: name

Param: callback

Example

on

Type declaration

Type Parameters

Parameters

Parameters

Returns ReturnType<EventTypes[K]>

Returns (() => void)

Returns void

Param: name

Param: callback

Param: once

Returns

Example

once

Type declaration

Type Parameters

Parameters

Parameters

Returns ReturnType<EventTypes[K]>

Returns (() => void)

Returns void

Param: name

Param: callback

Returns

Example

preloadPano

Type declaration

Parameters

Parameters