# ESViewer（视口（抽象基类））

> 类型：管理器/基础设施类 | 继承链：`Destroyable -> ESViewer`

视口抽象基类（objm.activeViewer）。具体实现为 ESCesiumViewer/ESOlViewer/ESUeViewer（引擎适配包）。提供相机、拾取、导航模式、编辑、事件、截图等能力。对象由 ViewersManager 自动 add/delete，开发者一般不手动调。

## 属性

| 属性 | 类型 | 默认值 | 说明 | 来源 |
| --- | --- | --- | --- | --- |
| `actived` | - | - | 获取视口是否激活。 | ESViewer |
| `completeJson` | - | - | 获取视口的 JSON 表示，包含所有属性。包括默认值。 | ESViewer |
| `container` | - | - | 获取视口的容器。 | ESViewer |
| `containerSize` | - | - | 获取视口容器的大小。 | ESViewer |
| `defaultProps` | - | - | 获取视口的默认属性。 | ESViewer |
| `esViewerExtensions` | - | - | ESViewer扩展 能力集合 ：统一的鼠标位置信息；屏幕渲染器等 | ESViewer |
| `id` | - | - | 获取视口的 ID。 | ESViewer |
| `json` | - | - | 获取视口的 JSON 表示。 | ESViewer |
| `navigationMode` | - | - | 获取导航模式。 | ESViewer |
| `overlayContainer` | - | - | 获取覆盖层容器。 | ESViewer |
| `sceneObjects` | - | - | 获取场景对象的迭代器。 | ESViewer |
| `sceneObjectsMap` | - | - | 获取场景对象映射表。 | ESViewer |
| `status` | - | - | 获取视口的状态。 | ESViewer |
| `statusLog` | - | - | 获取视口的状态日志。 | ESViewer |
| `subContainer` | - | - | 获取子容器。 | ESViewer |
| `syncViewer` | - | - | 获取同步的视口。 | ESViewer |
| `toDestroyFunc` | - | - | 获取销毁函数。 | ESViewer |
| `typeName` | - | - | 获取视口的类型名称。 | ESViewer |
| `updateFunc` | - | - | 获取更新函数。 | ESViewer |
| `useCustomInteraction` | - | - | 获取是否使用自定义交互。 | ESViewer |

## 方法

| 方法 | 参数 | 返回 | 说明 | 来源 |
| --- | --- | --- | --- | --- |
| `add(...sceneObjects: T[])` | ...sceneObjects: T[] | - | 向视口中添加场景对象。<br>**参数**：sceneObjects - 要添加的场景对象数组。 | ESViewer |
| `capture(resx?: number, resy?: number)` | resx?: number, resy?: number | Promise<string \| undefined> | 捕获视口的图像。 objm.activeViewer.capture(166,166).then(res=>{      console.log("缩略图",res) })<br>**参数**：resx - 图像的宽度。；resy - 图像的高度。 | ESViewer |
| `changeToFollow(objectId: string, distance?: number, heading?: number, pitch?: number, relativeRotation?: boolean)` | objectId: string, distance?: number, heading?: number, pitch?: number, relativeRotation?: boolean | void | 切换到跟随模式。      let human=objm.createSceneObjectFromJson( {                 "id": "ESHumanTest",                 "ref": "ESHuman_obj",                 "type": "ESHuman",                 "position": [                     109.60681752569195,                     18.58679192126289,                     0.5                 ],                 "rotation": [                     -8.135989761566222,                     0,                     0                 ],                 "name": "工人1",                 "animation": "walking"             })             let poi=objm.createSceneObjectFromJson({                             "id": "bbce8c58-f45e-4365-858f-624f9595a761",                             "type": "ESImageLabel",                             "position": [                                 109.6074882,                                 18.5868828,                                 0.5                             ],                             "rotation": [                                 -90,                                 0,                                 0                             ],                             "name": "蓝色相机1",                             "renderMode": 4                 })                 // 开启                 objm.activeViewer.changeToFollow('ESHumanTest', 20)                 //人物移动                 human.smoothMove([109.6074882, 18.5868828, 0.5], 20);<br>**参数**：objectId - 要跟随的对象 ID。；distance - 距离。；heading - 航向。；pitch - 俯仰角。；relativeRotation - 是否相对旋转。 | ESViewer |
| `changeToLine(geoLineStringId: string, speed?: number, heightOffset?: number, loop?: boolean, turnRateDPS?: number, lineMode?: "auto" | "manual")` | geoLineStringId: string, speed?: number, heightOffset?: number, loop?: boolean, turnRateDPS?: number, lineMode?: "auto" \| "manual" | void | 切换到沿线路径模式。 const sceneObject = objm.createSceneObjectFromJson({             "id": "9dc8d658-6287-4913-934a-06e1e8d6e22c",             "type": "ESGeoLineString",             "name": "ESGeoLineString_9dc8",             "allowPicking": true,             "points": [                 [                     111.86195260395567,                     22.307662979880124,                     -0.1803640225459114                 ],                 [                     111.8627277614124,                     22.306607462973968,                     0.08754877958473307                 ],                 [                     111.86171763564357,                     22.30720259529167,                     -0.40015763944409843                 ]             ]         })         objm.activeViewer.changeToLine('9dc8d658-6287-4913-934a-06e1e8d6e22c', 30, 80, false, 10, "auto")<br>**参数**：geoLineStringId - 地理线字符串 ID。；speed - 速度。；heightOffset - 高度偏移。；loop - 是否循环。；turnRateDPS - 转弯速率（度/秒）。；lineMode - 线路模式。 | ESViewer |
| `changeToMap()` | - | void | 切换到地图模式。 objm.activeViewer.changeToMap() | ESViewer |
| `changeToRotateGlobe(latitude?: number, height?: number, cycleTime?: number)` | latitude?: number, height?: number, cycleTime?: number | void | 切换到旋转地球模式。 let latitude=38 let height=10000000 let cycleTime=60 objm.activeViewer.changeToRotateGlobe(latitude, height, cycleTime)<br>**参数**：latitude - 纬度。；height - 高度。；cycleTime - 周期时间。 | ESViewer |
| `changeToRotatePoint(position: ESJVector3D, distance?: number, orbitPeriod?: number, heading?: number, pitch?: number)` | position: ESJVector3D, distance?: number, orbitPeriod?: number, heading?: number, pitch?: number | void | 切换导航模式为“RotatePoint”（绕点）绕点旋转。此模式允许用户绕点旋转。   const model = objm.createSceneObjectFromJson({             "id": "8e8ead4c-a95c-445d-b870-01ad98cd344c",             "type": "ESGltfModel",             "position": [                 109.60681752569195, 18.58679192126289, 1             ],             "name": "大楼1"         });                  objm.activeViewer.changeToRotatePoint([109.60681752569195, 18.58679192126289, 1], 300)<br>**参数**：position - 要环绕的点位置（经纬度）。；heading - 初始的环绕角度，默认0。；pitch - 初始的环绕俯仰角，默认-30。；distance - 距离点的距离，默认50000米 ，单位米；orbitPeriod - 默认环绕一周的时间 单位S,默认60S。 | ESViewer |
| `changeToUserDefined(userDefinedPawn: string)` | userDefinedPawn: string | void | 切换到用户自定义模式。 objm.activeViewer.changeToUserDefined('UE场景中自定义的Pawn的复制引用路径')<br>**参数**：userDefinedPawn - 用户自定义的角色。 | ESViewer |
| `changeToWalk(position: ESJVector3D, jumpZVelocity?: number, eyeHeight?: number)` | position: ESJVector3D, jumpZVelocity?: number, eyeHeight?: number | void | 切换到步行模式。 let position=[109.60681752569195, 18.58679192126289, 200.9999999980438226] let jumpZVelocity=4.2 let eyeHeight=1.2 objm.activeViewer.changeToWalk(position,jumpZVelocity,eyeHeight)<br>**参数**：position - 位置。；jumpZVelocity - 跳跃的 Z 轴速度。默认4.2米/秒。；eyeHeight - 眼睛高度。默认1.6米 | ESViewer |
| `clearAllSceneObjects()` | - | - | 清空视口中的所有场景对象。 objm.activeViewer.clearAllSceneObjects() | ESViewer |
| `delete(...sceneObjects: T[])` | ...sceneObjects: T[] | - | 从视口中删除场景对象。<br>**参数**：sceneObjects - 要删除的场景对象数组。 | ESViewer |
| `disAdd(...sceneObjects: T[])` | ...sceneObjects: T[] | - | 别名，同 disposableAdd。<br>**参数**：sceneObjects - 要添加的场景对象数组。 | ESViewer |
| `disposableAdd(...sceneObjects: T[])` | ...sceneObjects: T[] | - | 一次性添加场景对象，并返回一个用于删除这些对象的函数。<br>**参数**：sceneObjects - 要添加的场景对象数组。 | ESViewer |
| `flyIn(position: ESJVector3D, rotation?: ESJVector3D, duration?: number, flyMode?: "default" | "uniform")` | position: ESJVector3D, rotation?: ESJVector3D, duration?: number, flyMode?: "default" \| "uniform" | void | 飞行到指定位置。<br>**参数**：position - 目标位置。；rotation - 目标旋转角度。；duration - 飞行持续时间。；flyMode - 飞行模式。 | ESViewer |
| `flyTo(flyToParam: ESJFlyToParam, position: ESJVector3D, flyMode?: "default" | "uniform")` | flyToParam: ESJFlyToParam, position: ESJVector3D, flyMode?: "default" \| "uniform" | void | 根据飞行参数飞行到指定位置。<br>**参数**：flyToParam - 飞行参数。；position - 目标位置。；flyMode - 飞行模式。 | ESViewer |
| `flyToBoundingSphere(rectangle: ESJVector4D, distance?: number, duration?: number | undefined)` | rectangle: ESJVector4D, distance?: number, duration?: number \| undefined | void | 飞行到指定边界球。<br>**参数**：rectangle - 边界球的矩形区域。；distance - 距离。；duration - 飞行持续时间。 | ESViewer |
| `forceRecreate()` | - | - | 强制重新创建视口。 | ESViewer |
| `getBoundSphere(id: string)` | id: string | Promise< | 获取指定 ID 对象的边界球信息。<br>**参数**：id - 对象的 ID。 | ESViewer |
| `getCurrentRectangle()` | - | Promise<ESJRectangle \| undefined> | 获取当前视口的矩形范围。 const rectangle = await objm.activeViewer.getCurrentRectangle(); console.log(rectangle);<br>**返回**：当前视口的矩形范围。[west,south,east,north] | ESViewer |
| `getEngineObject(sceneObject: ESSceneObject)` | sceneObject: ESSceneObject | - | 根据场景对象获取对应的引擎对象。<br>**参数**：sceneObject - 场景对象。 | ESViewer |
| `getEngineType()` | - | - | 获取引擎类型。 | ESViewer |
| `getESProperties()` | - | - | 获取对象的 ES 属性，用于特定的 ES 相关操作。<br>**返回**：ES 属性对象。 | ESViewer |
| `getFPS()` | - | number | 获取帧率。 | ESViewer |
| `getHeightByLonLat(lon: number, lat: number, channel?: string)` | lon: number, lat: number, channel?: string | Promise<number \| null> | 根据经纬度获取高度。<br>**参数**：lon - 经度。；lat - 纬度。；channel - 通道，UE特有属性。 | ESViewer |
| `getHeightsByLonLats(lonLats: ESJVector2DArray, channel?: string)` | lonLats: ESJVector2DArray, channel?: string | Promise<(number \| null)[] \| undefined> | 根据经纬度数组获取高度数组。<br>**参数**：lonLats - 经纬度数组。；channel - 通道，UE特有属性。 | ESViewer |
| `getLengthInPixel()` | - | number \| undefined | 获取像素对应的长度。 | ESViewer |
| `getNavigationMode()` | - | - | 获取导航模式。 | ESViewer |
| `getTerrainHeight(position: ESJVector2D | ESJVector3D)` | position: ESJVector2D \| ESJVector3D | Promise<number \| undefined> | 获取位置点的地形高度。<br>**参数**：position - 位置点。 | ESViewer |
| `getVersion()` | - | - | 获取版本信息。 | ESViewer |
| `has(sceneObject: T)` | sceneObject: T | - | 判断视口中是否包含某个场景对象。<br>**参数**：sceneObject - 要判断的场景对象。 | ESViewer |
| `lonLatAltToScreenPosition(position: ESJVector3D)` | position: ESJVector3D | Promise<ESJVector2D \| undefined> | 将经纬度高度坐标转换为屏幕位置。 objm.activeViewer.lonLatAltToScreenPosition([116.2354,23.3244,20]).then(res=>{      console.log("经纬度转屏幕坐标",res) })<br>**参数**：position - 经纬度高度坐标。 | ESViewer |
| `moveObjects(sceneObjects: ESSceneObject[])` | sceneObjects: ESSceneObject[] | void | 统一整体移动场景对象。  const sceneObj=objm.createSceneObjectFromJson({             "id": "30caacb6-6fe0-4406-8f70-d3fbae1a2c50",             "type": "ESImageLabel",             "name": "蓝色相机1",             "position": [                 119.36369331577765,                 34.6622708940133,                 -3143.483106725995             ]         })         const sceneObj1=objm.createSceneObjectFromJson({             "id": "74100d5d-1a30-4b2d-9ba1-eea2a3840418",             "type": "ESTextLabel",             "name": "白小文本1",             "position": [                 110.45053587251344,                 32.26032172725045,                 -2562.356604123618             ],             "text": "白小文本1"         })         objm.activeViewer.moveObjects([sceneObj,sceneObj1])<br>**参数**：sceneObjects - 要移动的场景对象数组。 | ESViewer |
| `pick(screenPosition: ESJVector2D, attachedInfo?: any, parentInfo?: boolean)` | screenPosition: ESJVector2D, attachedInfo?: any, parentInfo?: boolean | Promise<ESJPickedResult \| undefined> | 在屏幕位置进行拾取操作。<br>**参数**：screenPosition - 屏幕位置。；attachedInfo - 附加信息。；parentInfo - 是否包含父信息。 | ESViewer |
| `pickPosition(screenPosition: ESJVector2D)` | screenPosition: ESJVector2D | Promise<ESJVector3D \| undefined> | 在屏幕位置拾取三维坐标。<br>**参数**：screenPosition - 屏幕位置。 | ESViewer |
| `quickPickPosition(screenPosition: ESJVector2D)` | screenPosition: ESJVector2D | Promise<ESJVector3D \| undefined> | 在屏幕位置快速拾取三维坐标。UE下和pickPosition功能一致，Cesium下不会触发3DTileset的preUpdate事件，性能较高。<br>**参数**：screenPosition - 屏幕位置。 | ESViewer |
| `setCurrentTime(value: number | string)` | value: number \| string | - | 设置当前时间。 字符串格式 2024 06 26 12:34:56 或者 2023-09-29 或者 2023/09/29 12:34:56<br>**参数**：value - 时间戳(毫秒)数值或者时间格式字符串 | ESViewer |
| `setStatus(value: ViewerStatus)` | value: ViewerStatus | - | 设置视口的状态。<br>**参数**：value - 视口的状态。 | ESViewer |
| `setStatusLog(value: string)` | value: string | - | 设置视口的状态日志。<br>**参数**：value - 状态日志内容。 | ESViewer |
| `startEditing(sceneObject: ESSceneObject, modes: ESJEditingModeType[] | ESJEditingModeType, options?: { useKeyToSwitch?: boolean; callSource?: "outer" | "inner" })` | sceneObject: ESSceneObject, modes: ESJEditingModeType[] \| ESJEditingModeType, options?: { useKeyToSwitch?: boolean; callSource?: "outer" \| "inner" } | void | 开始编辑场景对象。 const sceneObj=objm.createSceneObject('ESImageLabel') sceneObj.position=[116.2334,23.4453,30] objm.activeViewer.startEditing(sceneObj,'translation')<br>**参数**：sceneObject - 要编辑的场景对象。；modes - 编辑模式数组或单个模式，可通过ESJEditingMode枚举进行调用。；options - 编辑选项。；options.useKeyToSwitch - 是否使用键盘切换编辑模式，默认false。设为true时可通过键盘快捷键切换平移/旋转/缩放等模式。；options.callSource - 调用来源，'outer'表示外部调用，'inner'表示内部调用，默认'outer'。 | ESViewer |
| `stopEditing()` | - | void | 停止编辑。 objm.activeViewer.stopEditing() | ESViewer |
| `syncOtherViewer(viewer: ESViewer | undefined)` | viewer: ESViewer \| undefined | - | 同步另一个视口的属性。<br>**参数**：viewer - 要同步的视口，undefined 时解绑。 | ESViewer |
| `transformFlyParam(position: ESJVector3D, flyParam: ESJFlyInParam | ESJFlyToParam)` | position: ESJVector3D, flyParam: ESJFlyInParam \| ESJFlyToParam | ESJFlyToParam \| ESJFlyInParam \| undefined | 飞行参数互相转换 | ESViewer |

## 事件

| 事件 | 说明 | 来源 |
| --- | --- | --- |
| `activedChanged` | 获取视口激活状态变化的事件。 | ESViewer |
| `cameraChanged` | 获取相机变化事件。 | ESViewer |
| `clickEvent` | 获取鼠标单击事件。  objm.activeViewer.clickEvent.don((e) => {                 const { screenPosition, pointerEvent } = e;                 console.log('屏幕坐标: ',screenPosition);                 console.log(pointerEvent);             }) | ESViewer |
| `containerChanged` | 获取容器变化的事件。 | ESViewer |
| `containerResetEvent` | 获取容器重置事件。 | ESViewer |
| `containerSizeChanged` | 获取容器大小变化的事件。 | ESViewer |
| `dblclickEvent` | 获取鼠标双击事件。 objm.activeViewer.dblclickEvent.don((e) => {                 const { screenPosition, pointerEvent } = e;                 console.log('屏幕坐标: ',screenPosition);                 console.log(pointerEvent);             }) | ESViewer |
| `editingEvent` | 获取编辑事件。 | ESViewer |
| `hoverEvent` | 鼠标悬停事件 悬停时长可由 hoverTime 属性控制。  objm.activeViewer.hoverEvent.don((e) => {                 const { screenPosition, pointerEvent } = e;                 console.log('屏幕坐标: ',screenPosition);                 console.log('pointerEvent:',pointerEvent);             }) | ESViewer |
| `keyDownEvent` | 获取键盘按下事件。 objm.activeViewer.keyDownEvent.don((e) => {                 console.log(`键盘按下:',e.key);             }) | ESViewer |
| `keyUpEvent` | 获取键盘抬起事件。 objm.activeViewer.keyUpEvent.don((e) => {                 console.log(`键盘抬起:',e.key);             }) | ESViewer |
| `navigationEvent` | - | ESViewer |
| `navigationModeChanged` | 获取导航模式变化的事件。 | ESViewer |
| `overlayContainerChanged` | 获取覆盖层容器变化的事件。 | ESViewer |
| `pointerDownEvent` | 获取鼠标指针按下事件。 objm.activeViewer.pointerDownEvent.don((e) => {                 const { screenPosition, pointerEvent } = e;                 console.log('屏幕坐标: ',screenPosition);                 console.log(pointerEvent);             }) | ESViewer |
| `pointerMoveEvent` | 获取鼠标指针移动事件。 objm.activeViewer.pointerMoveEvent.don((e) => {                 const { screenPosition, pointerEvent } = e;                 console.log('屏幕坐标: ',screenPosition);                 console.log(pointerEvent);             }) | ESViewer |
| `pointerOutEvent` | 获取鼠标指针移出事件。  objm.activeViewer.pointerOutEvent.don((e) => {                 const { screenPosition, pointerEvent } = e;                 console.log('屏幕坐标: ',screenPosition);                 console.log(pointerEvent);             }) | ESViewer |
| `pointerOverEvent` | 获取鼠标指针进入事件。 objm.activeViewer.pointerOverEvent.don((e) => {                 const { screenPosition, pointerEvent } = e;                 console.log('屏幕坐标',screenPosition);                 console.log(pointerEvent);             }) | ESViewer |
| `pointerUpEvent` | 获取鼠标指针抬起事件。  objm.activeViewer.pointerUpEvent.don((e) => {                 const { screenPosition, pointerEvent } = e;                 console.log('屏幕坐标: ',screenPosition);                 console.log(pointerEvent);             }) | ESViewer |
| `statusChanged` | 获取视口状态变化的事件。 | ESViewer |
| `statusLogChanged` | 获取视口状态日志变化的事件。 | ESViewer |
| `subContainerChanged` | 获取子容器变化的事件。 | ESViewer |
| `syncViewerChanged` | 获取同步视口变化的事件。 | ESViewer |
| `toDestroyFuncChanged` | 获取销毁函数变化的事件。 | ESViewer |
| `updateFuncChanged` | 获取更新函数变化的事件。 | ESViewer |
| `viewerChanged` | 获取视口变化事件。 | ESViewer |
| `wheelEvent` | 获取滚轮事件。  objm.activeViewer.wheelEvent.don((e) => {                 const { deltaX, deltaY } = e;                 console.log('鼠标滚动:',deltaX,deltaY);             }) | ESViewer |

---
> 本文由 `generate-docs.mjs` 从源码自动生成，请勿手改。