nc-uesdk

v1.5.5

Published

6 months ago

三维SDK # 核心类（Core） *** ### 引入 ```javascript import { initUePixelStreaming, addEventListener, removeEventListener } from '../Core/connect'; ```  #### 方法列表 - initUePixelStreaming---初始

0High
0Medium
0Low

lj1305599284

UESDK

三维SDK

核心类（Core）

引入

import { initUePixelStreaming, addEventListener, removeEventListener } from '../Core/connect';

方法列表

initUePixelStreaming---初始化三维场景
addEventListener---增加像素流监听
removeEventListener---移除像素流监听
getStream---获取像素流

initUePixelStreaming参数列表

|name|类型|描述| |-|-|-| |url|string|像素流地址| |dom|HTMLElement|渲染器场景容器|

<!--创建的三维窗口-->
<div id="container" style="position: absolute;"></div>

const ueDom = document.getElementById('totals') as HTMLElement //获取容器
const url = 'ws://localhost:80'
initUePixelStreaming(url, ueDom) //不改变焦点移动相机

addEventListener参数列表

|name|类型|描述| |-|-|-| |streams|PixelStreaming|像素流|

import initUePixelStreaming from '../Core/connect'
const streams = initUePixelStreaming('ws://localhost:80', ueDom)
addEventListener(streams).then((val) => {
   
})

removeEventListener参数列表

|name|类型|描述| |-|-|-| |streams|PixelStreaming|像素流|

import initUePixelStreaming from '../Core/connect'
const streams = initUePixelStreaming('ws://localhost:80', ueDom)
removeEventListener(streams)

getStream参数列表

|无| |-|

getStream()

相机类（Camera）

引入

import {Camera} from "../Camera/Camera";

初始化

const myCamera = new Camera()

方法列表

getCameraMatrix---获取相机参数(矩阵)
flyToLonLat---通过地理坐标飞行定位相机位置
flyToWorld---通过世界坐标飞行定位相机位置
lock---相机锁定
unlock---相机解锁
setAutogiration---相机沿视图中心自动旋转
setCameraBoundBox---镜头范围限制
setUnderground---相机是否可进入地下
setCameraType---设置相机模式
refreshCamera---重置场景初始镜头

getCameraMatrix参数列表

|无| |-|

myCamera.getCameraMatrix() //获取相机矩阵

setCameraBoundBox参数列表

|name|类型|描述| |-|-|-| |positionA|Vector3|左上角坐标| |positionB|Vector3|右下角坐标|

const left = new Vector3(114.0, 24.0, 0.0)
const right = new Vector3(115.0, 23.0, 0.0)
myCamera.setCameraBoundBox(left,right)

flyToLonLat参数列表

import { Vector3 } from '../Math/Vector3'
const position = new Vector3(111.588745,28.791234,491286.246862)
const pitch = -67.0
const yaw = -70.0
myCamera.flyToLonLat(position, pitch, yaw)

flyToWorld参数列表

import { Vector3 } from '../Math/Vector3'
const position = new Vector3(-275440.0,1036160.0,-428000.0)
const pitch = -67.0
const yaw = -70.0
myCamera.flyToWorld(position, pitch, yaw)

lock参数列表

|无| |-|

myCamera.lock()  //锁定相机，不可移动

unlock参数列表

|无| |-|

myCamera.unlock()  //解锁相机，可移动

副相机类（DeviceCamera）

引入

import { DeviceCamera } from '../../Base/DeviceCamera'

初始化

var deviceCamera: DeviceCamera
    deviceCamera = new DeviceCamera(
        {
            name: 'name1',
            vieoPosition : new Vector2(0, 0),
            CameraPostion : new Vector3(6342330.0,-11466610.0,-130310.0),
            CameraRotate : new Vector3(0, 0, 0),
            VisualAngle:'90',
            CameraType:'1',
            VideoSize:new Vector2(100,100)
        })
    deviceCamera.getCameraMatrix().then(res=>{
        console.log(res)
    })

方法列表

getCameraMatrix---获取副相机矩阵
setCameraPosition---设置副相机位置
setCameraRotate---设置副相机旋转
setVideoPosition---设置副相机画面位置
setVideoSize---设置副相机画面尺寸
setCameraType---设置副相机类型（正交/透视），与参数
setCameraLookAt---设置副相机朝向
setCameraLookActor---设置副相机朝向对象（可锁定）
unlockCameraLookActor---解除副相机对象锁定
setCameraFolowActor---设置副相机跟随对象
removeCamerFolow---解除副相机对象跟随
destroy---销毁副相机

getCameraMatrix参数列表

|无| |-|

deviceCamera.getCameraMatrix() //获取相机矩阵

setCameraPosition参数列表

|name|类型|描述| |-|-|-| |CameraPostion|Vector3|相机坐标|

import { Vector3 } from '../Math/Vector3'
const position = new Vector3(111.588745,28.791234,491286.246862)
 deviceCamera.setCameraPosition(position)

setCameraRotate参数列表

|name|类型|描述| |-|-|-| |CameraRotate|Vector3|相机旋转坐标|

import { Vector3 } from '../Math/Vector3'
const CameraRotate = new Vector3(0,0,-90)
deviceCamera.setCameraRotate(CameraRotate)

setVideoPosition参数列表

|name|类型|描述| |-|-|-| |vieoPosition|Vector2|副相机画面位置|

let vieoPosition = new Vector2(100,200)
deviceCamera.setVideoPosition(vieoPosition)

setVideoSize参数列表

|name|类型|描述| |-|-|-| |VideoSize|Vector2|副相机画面尺寸|

let VideoSize = new Vector2(100,200)
deviceCamera.setVideoSize(VideoSize)

setCameraType参数列表

|name|类型|描述| |-|-|-| |CameraType|string|副相机类型| |VisualAngle|string|相机参数|

// 透视相机相关
let CameraType = 'Perspective'//透视相机
let VisualAngle = '90'//相机可视角度
deviceCamera.setCameraType(CameraType,VisualAngle)

// 正交相机相关
let CameraType = 'Orthographic'//透视相机
let VisualAngle = '5000'//相机可视角度
deviceCamera.setCameraType(CameraType,VisualAngle)

setCameraLookAt参数列表

|name|类型|描述| |-|-|-| |lookPos|Vector3|副相机朝向坐标|

let lookPos = new Vector3(6341330.0,-11466610.0,-130310.0)
deviceCamera.setCameraLookAt(lookPos )

setCameraLookActor参数列表

|name|类型|描述| |-|-|-| |ActorName|string|副相机看向对象名| |lockflag|boolean|副相机是否锁定对象|

let ActorName = 'cube'
let lockflag = true
deviceCamera.setCameraLookActor('cube',true)

unlockCameraLookActor参数列表

|无| |-|

let ActorName = 'cube'
let lockflag = true
deviceCamera.setCameraLookActor('cube',true)

setCameraFolowActor参数列表

|name|类型|描述| |-|-|-| |ActorName|string|副相机跟随对象名|

let ActorName = 'cube'
deviceCamera.setCameraFolowActor(ActorName)

removeCamerFolow参数列表

|无| |-|

    deviceCamera.removeCamerFolow()

destroy参数列表

|无| |-|

    deviceCamera.destroy()

Object3D类（Object3D）

引入

import { Object3D } from "../Object3D/Object3D";

初始化

const myObject3D = new Object3D( 
    {
        name: 'exampleName',
        groupId: 'myObject3D1',
        position: new Vector3(0, 0, 0), //坐标
        rotate: new Vector3(0, 0, 0),   //旋转
        size: new Vector3(1, 1, 1)      //大小
    })

方法列表

setVisible---根据uuid控制指定对象显隐
setGroupVisible---根据groupId控制一组对象显隐
setAllVisible---控制所有对象显隐
setGroupId---设置组ID
setPosition---设置位置
setRotate---设置旋转
setSize---根据缩放
getMatrix---获取对象矩阵
delete---根据uuid删除指定对象
remove---根据groupId删除指定一组对象
clear---删除所有对象

setVisible参数列表

|name|类型|描述| |-|-|-| |visibleType|visibleType|显隐性|

const visibleType = 1 //1为隐藏0为显示
myObject3D.visibleType(visibleType)

setGroupVisible参数列表

|name|类型|描述| |-|-|-| |visibleType|visibleType|显隐性|

const visibleType = 1 //1为隐藏0为显示
myObject3D.setGroupVisible(visibleType)

setAllVisible参数列表

|name|类型|描述| |-|-|-| |visibleType|visibleType|显隐性|

const visibleType = 1 //1为隐藏0为显示
myObject3D.setAllVisible(visibleType)

setGroupId参数列表

|name|类型|描述| |-|-|-| |id|string|组ID|

const id = 'myObject3D1'
myObject3D.setGroupId(id)

setPosition参数列表

|name|类型|描述| |-|-|-| |position|Vector3|坐标向量|

import { Vector3 } from '../Math/Vector3'
const position = new Vector3(0, 0, 0)
myObject3D.setPosition(position)

setRotate参数列表

|name|类型|描述| |-|-|-| |position|Vector3|旋转向量|

import { Vector3 } from '../Math/Vector3'
const position = new Vector3(0, 0, 0)
myObject3D.setRotate(position)

setSize参数列表

|name|类型|描述| |-|-|-| |position|Vector3|大小向量|

import { Vector3 } from '../Math/Vector3'
const position = new Vector3(1, 1, 1)
myObject3D.setSize(position)

getMatrix参数列表

|无| |-|

myObject3D.getMatrix()

delete参数列表

|无| |-|

myObject3D.delete()

remove参数列表

|无| |-|

myObject3D.remove()

clear参数列表

|无| |-|

myObject3D.clear()

Glb类（Glb）

引入

import { Glb } from '../Object3D/Glb';

初始化

const myglb = new Glb('myglb')

方法列表

setUrl---通过url加载模型
clearGlb---移除模型
setLongLatPosition---设置模型位置
getGlbByName---通过名字获取模型
StopAnimation---模型动画停止
StartAnimation---模型动画开始
getGlbNode---获取GLB模型子树

setUrl参数列表

|name|类型|描述| |-|-|-| |url|string|模型网址|

myglb.setUrl('http://10.0.0.153:8080/uva.glb').then((val:any) => {
})

clearGlb参数列表

|无| |-|

myglb.clearGlb()

setLongLatPosition参数列表

|name|类型|描述| |-|-|-| |position|Vector3|坐标向量|

import { Vector3 } from '../Math/Vector3'
const position = new Vector3(0, 0, 0)
myglb.setLongLatPosition(position)

getGlbByName参数列表

|name|类型|描述| |-|-|-| |name|string|模型名称|

const name = 'myglb'
myglb.getGlbByName(name)

setClick参数列表

|name|类型|描述| |-|-|-| |click|string|事件开关|

const click = '1'
myglb.setClick(click)

StopAnimation参数列表

|无| |-|

myglb.StopAnimation()

StartAnimation参数列表

|无| |-|

myglb.StartAnimation()

三维瓦片类（Tileset）

引入

import { Tileset } from '../Object3D/loadTileset';

初始化

const mytileset = new Tileset('dianyun','http://localhost:8090/dm/tileset.json')

方法列表

setLongLat---设置瓦片位置

setLongLat参数列表

|name|类型|描述| |-|-|-| |position|any|坐标向量|

import { Vector3 } from '../Math/Vector3'
const position = new Vector3(113.8,31.25,20000.0)
mytileset.setLongLat(position)

面类（Polygon）

引入

import { Polygon } from "../Object3D/Polygon";

初始化

const myPolygon = new Polygon('myPolygon', 500)

方法列表

setMaterial---设置材质
build---构造几何

setMaterial参数列表

|name|类型|描述| |-|-|-| |material|material|材质|

import { Vector3 } from '../Math/Vector3'
import { Material } from '../Material/Material'
const material = new Material(new Vector3(0.5,1,1))
myPolygon.setMaterial(material)

build参数列表

|无| |-|

myPolygon.build()

Spline类（Spline）

引入

import { Spline } from '../Object3D/spline';

初始化

const mySpline = new Spline('mySpline1')

方法列表

clickAddSpline---鼠标点击构线
addPointList---坐标数组构线
addPipeByList---坐标数组构实体线(UE坐标)
addPipeByCoorList---坐标数组构实体线(经纬度)
deletePipe---删除实体线
changeSplineWidth---修改线条宽度
changeSplineMaterial---修改线条材质
addPoint---指点游标添加点
removeIndexPoint---指点游标删除点
moveActorBySpline---指定物体沿线移动
changeState---修改运动状态
changeSpeed---修改运动速度
setNewTime---指定时刻下的物体位置

clickAddSpline参数列表

|name|类型|描述| |-|-|-| |clickAddSpline|Number|线条宽度|

const lindwidth = 10
// 用户Alt+鼠标左键点击绘线，Alt+鼠标右键结束绘线
mySpline.clickAddSpline(lindwidth)

addPointList参数列表

|name|类型|描述| |-|-|-| |pointList|Array|坐标数组|

import { Vector3 } from '../Math/Vector3'
const pointPositions = [new Vector3(0.0,0.0,0.0),new Vector3(1.0,1.0,1.0)，new Vector3(2.0,2.0,2.0)]
mySpline.addPointList(pointPositions)

removeIndexPoint参数列表

|name|类型|描述| |-|-|-| |index|string|点的index|

const index = '0'
mySpline.removeIndexPoint(index)

addPipeByList参数列表

import { Vector3 } from '../Math/Vector3'
const pointPositions = [new Vector3(0.0,0.0,0.0),new Vector3(1.0,1.0,1.0)，new Vector3(2.0,2.0,2.0)]
const splineMaterial = new LightMaterial(100)
mySpline.addPipeByList(pointPositions,'1000', splineMaterial,'LightMaterial','square')

removeIndexPoint参数列表

|name|类型|描述| |-|-|-| |index|string|点的index|

const index = '0'
mySpline.removeIndexPoint(index)

deletePipe参数列表

|name|类型|描述| |无| |-|

const pointPositions = [new Vector3(0.0,0.0,0.0),new Vector3(1.0,1.0,1.0)，new Vector3(2.0,2.0,2.0)]
const splineMaterial = new LightMaterial(100)
mySpline.addPipeByList(pointPositions,'1000', splineMaterial,'LightMaterial','square')
// 添加实体管道（addPipeByList）后使用
mySpline.deletePipe()

changeSplineWidth参数列表

|name|类型|描述| |-|-|-| |width|String|宽度值|

import { Vector3 } from '../Math/Vector3'
const pointPositions = [new Vector3(0.0,0.0,0.0),new Vector3(1.0,1.0,1.0)，new Vector3(2.0,2.0,2.0)]
const splineMaterial = new LightMaterial(100)
mySpline.addPipeByList(pointPositions,'1000', splineMaterial,'LightMaterial','square')
mySpline.changeSplineWidth('100')

changeSplineMaterial参数列表

|name|类型|描述| |-|-|-| |Material|Material|基础材质|

import { Vector3 } from '../Math/Vector3'
const pointPositions = [new Vector3(0.0,0.0,0.0),new Vector3(1.0,1.0,1.0)，new Vector3(2.0,2.0,2.0)]
const splineMaterial = new LightMaterial(100)
mySpline.addPipeByList(pointPositions,'1000', splineMaterial,'LightMaterial','square')
const waterma = new WaterMaterial(new Vector3(1,1,0),1 ,1)
mySpline.changeSplineMaterial(waterma,'WaterMaterial')

addPoint参数列表

|name|类型|描述| |-|-|-| |position|Vector3|坐标向量| |index|string|点的index|

import { Vector3 } from '../Math/Vector3'
const pointPositions = [new Vector3(0.0,0.0,0.0),new Vector3(1.0,1.0,1.0)，new Vector3(2.0,2.0,2.0)]
mySpline.addPointList(pointPositions)
mySpline.addPoint(pointPositions,'0')

removeIndexPoint参数列表

|name|类型|描述| |-|-|-| |index|string|点的index|

import { Vector3 } from '../Math/Vector3'
const pointPositions = [new Vector3(0.0,0.0,0.0),new Vector3(1.0,1.0,1.0)，new Vector3(2.0,2.0,2.0)]
mySpline.addPointList(pointPositions)
mySpline.removeIndexPoint(pointPositions,'0')

moveActorBySpline参数列表

import { Vector3 } from '../Math/Vector3'
const pointPositions = [new Vector3(0.0,0.0,0.0),new Vector3(1.0,1.0,1.0)，new Vector3(2.0,2.0,2.0)]
mySpline.addPointList(pointPositions)
// 加载模型（地址动态调整），相机跟随模型运动
const myglb = new Glb('cs')
myglb.setUrl('http://10.0.0.124:8081/uva.glb')
mySpline.moveActorBySpline(myglb.uuid,2,true,68000)

changeState参数列表

|name|类型|描述| |-|-|-| |state|actorState|运动状态|

import { Vector3 } from '../Math/Vector3'
const pointPositions = [new Vector3(0.0,0.0,0.0),new Vector3(1.0,1.0,1.0)，new Vector3(2.0,2.0,2.0)]
mySpline.addPointList(pointPositions)
// 加载模型（地址动态调整），相机跟随模型运动
const myglb = new Glb('cs')
myglb.setUrl('http://10.0.0.124:8081/uva.glb')
mySpline.moveActorBySpline(myglb.uuid,2,true,68000)
mySpline.changeState('stop')

changeSpeed参数列表

|name|类型|描述| |-|-|-| |newSpeed|Number|新速度值|

import { Vector3 } from '../Math/Vector3'
const pointPositions = [new Vector3(0.0,0.0,0.0),new Vector3(1.0,1.0,1.0)，new Vector3(2.0,2.0,2.0)]
mySpline.addPointList(pointPositions)
// 加载模型（地址动态调整），相机跟随模型运动
const myglb = new Glb('cs')
myglb.setUrl('http://10.0.0.124:8081/uva.glb')
mySpline.moveActorBySpline(myglb.uuid,2,true,68000)
mySpline.changeSpeed(1)

changeSpeed参数列表

|name|类型|描述| |-|-|-| |newTime|Number|时刻值|

import { Vector3 } from '../Math/Vector3'
const pointPositions = [new Vector3(0.0,0.0,0.0),new Vector3(1.0,1.0,1.0)，new Vector3(2.0,2.0,2.0)]
mySpline.addPointList(pointPositions)
// 加载模型（地址动态调整），相机跟随模型运动
const myglb = new Glb('cs')
myglb.setUrl('http://10.0.0.124:8081/uva.glb')
mySpline.moveActorBySpline(myglb.uuid,2,true,68000)
mySpline.setNewTime(2)

精灵图类（Sprite）

引入

import { Sprite } from "../Object3D/Sprite";

初始化

const mySprite = new Sprite(Sprite1,"http://192.168.11.5:8081/zt3.png")

方法列表

setType---设置类型属性
setSpriteSize---设置精灵大小
setClick---设置点击事件
setSpriteOffset---设置锚点偏移

setType参数列表

|name|类型|描述| |-|-|-| |spriteType|spriteType|类型属性|

const spriteType = '2D'//2d、3d分别是相对于屏幕和场景
mySprite.setType(spriteType)

setSpriteSize参数列表

|name|类型|描述| |-|-|-| |size|Vector2|二维向量|

import { Vector2 } from '../Math/Vector2'
const Vector2 = new Vector2(1, 1)
mySprite.setSpriteSize(Vector2)

setClick参数列表

|name|类型|描述| |-|-|-| |fun|Function|方法|

mySprite.setClick(function(){
    console.log(city.name,'clickSprite')
    clickTh(city.name)
  })

setSpriteOffset参数列表

|name|类型|描述| |-|-|-| |fun|Function|方法|

import { Vector2 } from '../Math/Vector2'
const position = new Vector2(1,1)
mySprite.setSpriteOffset(position)

注记类（Text）

引入

import { Text } from '../Object3D/Text';

初始化

const myText = new Text('mytext','mytext')

方法列表

setLongLat---设置位置
setClick---设置点击事件
setTextOffset---设置锚点偏移

setLongLat参数列表

|name|类型|描述| |-|-|-| |position|any|坐标|

import { Vector3 } from '../Math/Vector3'
const position = new Vector3(113.8,31.25,20000.0)
myText.setLongLat(position)

setClick参数列表

|name|类型|描述| |-|-|-| |fun|Function|方法|

myText.setClick(function(){
    console.log(city.name,'clickText')
    clickTh(city.name)
  })

setTextOffset参数列表

|name|类型|描述| |-|-|-| |fun|Function|方法|

import { Vector2 } from '../Math/Vector2'
const position = new Vector2(1,1)
myText.setTextOffset(position)

Wall类（Wall）

引入

import { Wall } from '../Object3D/Wall';

初始化

const myWall = new Wall('武汉', 500)

方法列表

setMaterial---设置材质
build---构造围墙

setMaterial参数列表

|name|类型|描述| |-|-|-| |material|Material|材质|

import { Vector3 } from '../Math/Vector3'
import { Material } from '../Material/Material'
const material = new Material(new Vector3(0.5,1,1))
myWall.setMaterial(material)

build参数列表

|无| |-|

myWall.build()

坐标转换类（Coord）

引入

import convert from '../Math/Convert';