Viewer

Viewer 是描述孪生世界的顶层对象，提供场景绘制和交互的画布。

构造函数

Viewer(element)

在参数element指定的 DOM 元素中创建孪生世界场景。

示例代码：

//import { Viewer } from 'nsdt@ted'                    //引入Viewer类

const viewer = new Viewer('container')              //在id为container的元素内创建孪生世界
const sceneId = "63a13d2d39c45778ba1bedd0";         //要加载的场景的id
viewer.loadScene(sceneId,() => {                    //加载场景数据
  console.log('completed!')
})

属性

.canvas: HTMLCanvasElement

当前场景 canvas 容器。

.scene: THREE.Scene

孪生世界的 THREE.JS scene 场景。

.camera: Camera

孪生世界中的摄像机。

.environment: Environment

描述孪生世界中的天空等环境。

.objectGroup: THREE.Object3D[]

孪生世界中所有可拾取的 Object3d 对象。

方法

.addLayer(layer: Layer): Void

在孪生世界中创建数据图层。

示例代码：

//import DT from 'nsdt@ted'
const modelLayer = new DT.layer.ModelLayer("models"); //创建一个图层
viewer.addLayer(modelLayer);

.removeLayer(layer: Layer): Void

在孪生世界中删除数据图层。

.hasLayer(layer: Layer): Boolean

查询图层是否存在。

.getLayer(id: string): Layer | undefined

通过图层 id 获取图层。

.getLayers(): Layer[]

获取全部图层。

.getTwins(id: String): Twin

通过挛生体 id 获取挛生体。

.getWorldTree(): JSON

获取世界大纲树。

参数	说明
children	图层组中的挛生体
id	图层组 id
label	图层组名字
type	图层组类型
visible	是否显示

children 参数	说明
id	挛生体 id
layerId	图层组 id
label	挛生体名字
type	挛生体类型
visible	是否显示

.pickupCoord(event:MouseEvent): THREE.Vector3 | null

拾取与平面交点的坐标。

.pickup(event:MouseEvent): Object | null

拾取孪生世界 包含在 objectGroup 中的模型。

.setActiveTwins(twin: Twin[] | string[]): Void | null

传入挛生体实例对象或挛生体 id，批量设置挛生体的包围框。

.clearActive(): Void | null

清空所有挛生体的包围框。

.destroy(): Void

销毁场景。

.statistics(): { element: String, vertices: String, triangles: String }

统计场景中的 mesh 数量、顶点数和面数。

.loadScene(sceneId: string, cb: Function) Void

通过场景 id 加载孪生世界场景。

viewer.loadScene(sceneId,() => {
  console.log('completed!')
})

.getRoamingList(sceneId: string, cb: Function) Void

通过场景 id 获取孪生世界的漫游列表。

viewer.getRoamingList(sceneId, (res) => {
  const roamData = res[0].points
  const roaming = DT.RoamingPath.createRoamingPath(roamData, () => {
    console.log("complete");
  });
  roaming.start();
});

.setObjectGroup() THREE.Object3D[]

重新设置 objectGroup 数组，筛选出可拾取的 Object3d 对象。

.on(event: String, handler: Function, context?:Any): Void 绑定孪生世界事件的监听处理器。

.off(event: String, handler: Function): Void

解绑孪生世界事件的监听处理器。

.trigger(event: String): Void

触发绑定的孪生世界事件。

.position2Coordinate(longitude: number, latitude: number, altitude = 0): { x: number, y: number, z: number }

将经纬度转换为笛卡尔坐标系中的坐标(要先在编辑器中设置好坐标原点)

.coordinate2Position(x: number, y: number, z: number): { lng: number, lat: number, alt: number }

将笛卡尔坐标转换为经纬度坐标(要先在编辑器中设置好坐标原点)

.createTwinByObject3d(object3d:THREE.Object3D): Twin

通过object3d创建Twin对象

.getGridModelList(name: string, deepNumber: number, verticalNumber: number, alignNumber: number): Array

获取阵列摆放拆分后的模型列表

Option	Description
name	要匹配的阵列模型的名字正则式
deepNumber	层数
verticalNumber	列数
alignNumber	行数

事件

目前支持的事件如下：

事件	说明
DT.MouseEventType.CLICK	当鼠标点击场景时触发
DT.MouseEventType.DB_CLICK	当鼠标双击场景时触发
DT.MouseEventType.MOUSE_DOWN	当鼠标摁下时触发
DT.MouseEventType.MOUSE_UP	当鼠标抬起时触发
DT.MouseEventType.MOUSE_MOVE	当鼠标移动时触发
DT.MouseEventType.RIGHT_CLICK	当鼠标右击时触发

示例代码：

//监听鼠标单击事件
viewer.mouseEvent.on(DT.MouseEventType.CLICK, (e) => {
  console.log(e)      //打印鼠标信息
});