Container 容器
本框架的数据交互中心
在使用容器前,请将
node_modoules/cesium/Build/CesiumUnminified
复制到public
目录下,并将其中的Widgets
目录复制到assets
目录下
基本用法
通过Container
构建了一个渲染容器
视角控制
通过调用cameraTo
方法可以将摄像机设定至对应位置
如果希望有过渡的效果,那么也可以使用cameraFlyTo
方法
如果你不知道期望的位置的参数值,那么可以使用
mountCameraInfo
方法,可以实时获取当前位置的摄像机参数值,点击构建代码,即可获取到所需参数
加入地形以及水面效果
通过调用mountTerrain
方法可以打开Cesium
自带的地形以及水面效果,当然也可以传入自定义的地形url服务地址
修改影像
如果不想用Ceisum
自带的影像,通过调用setImageryProvider
方法可以修改影像,我们内置了高德、谷歌、天地图、火星相关影响地图,可以按照需求自行选择
API
Options
属性名 | 说明 | 类型 |
---|---|---|
viewer | Cesium 视图实例 | RTHREE_GID3D.Viewer |
width | 容器宽度 | number |
height | 容器高度 | number |
IRGIS3DConstructorOption
属性名 | 说明 | 类型 | 默认值 |
---|---|---|---|
baseURL | 资源基本地址 | string | '/RTHREE_GID3D' |
antialias | 是否开启抗锯齿 | boolean | true |
minimumZoomDistance | 最小缩放值 | number | 120 |
defaultAccessToken | Ceisum 默认token | string | - |
inited | 初始化完毕回调函数 | fucntion | - |
Methods
setEnableRotate(enabled: boolean)
设置视图是否允许旋转(true允许,false不允许)
setEnableZoom(enabled: boolean)
设置视图是否允许缩放(true允许,false不允许)
setEnableTilt(enabled: boolean)
设置视图是否允许倾斜相机
mountTerrain(url?: string)
挂载地形(不传参代表使用默认地形)
unmountTerrain
卸载地形
render
渲染函数
destroy
销毁(用于解决多浏览器下的性能问题)
resize(width?: number, height?: number)
尺寸调整(width和height非必填,若不填,则默认获取原始容器DOM的宽高)
setImageryProvider(imageryProviderType: ImageryProviderType, options?: IImageryProviderOption): Promise<Cesium.ImageryLayer>
设置地图影像(已内置高德、天地图、火星、谷歌),支持同时设置多个影像进行叠加,后添加的影像层级更高
container.setImageryProvider(RTHREE_GID3D.ImageryProviderType.AMAP, {
style: RTHREE_GID3D.AmapImageryProviderStyle.IMG
});
ImageryProviderType
AMAP:高德地图
TDT:天地图
ARCGIS:火星
GOOGLE:谷歌
IImageryProviderOption
属性名 | 说明 | 类型 | 默认值 |
---|---|---|---|
url | 影像资源或地址(非必填) | Ceisum.Resource |string | - |
key | 地图key | string | - |
style | 地图类型 | AmapImageryProviderStyle |TdtImageryProviderStyle |GoogleImageryProviderStyle (火星地图不需要传) | - |
subdomains | 服务负载子域(非必填) | number | ['01', '02', '03', '04'] |
minimumLevel | 最小地图级别 | number | - |
maximumLevel | 最大地图级别 | number | - |
tilingScheme | 瓦片组织方式 | Cesium.TilingScheme | |
index | 图层层级(非必填),默认为当前所有图层的顶层 | number |
AmapImageryProviderStyle
IMG:影像
ELEC:矢量图
CVA:标记图
TdtImageryProviderStyle
IMG:影像
CIA:标记图
GoogleImageryProviderStyle
IMG:影像
ELEC:矢量图
CVA:标记图
TER:板块图
IMG_CVA:影像+标记
removeImageryProvider(imageryLayer: Cesium.ImageryLayer)
移除指定地图影像
clearImageryProvider
清空所有影像
mountCameraInfo
构建摄像机信息面板(便于查看某视角下的摄像机各项参数,以实现场景初始视角、漫游等功能),不要在生产环境中使用(要在生产环境中使用,请使用getCameraView
)
getCameraView
获取当前的视角参数,用于业务逻辑中,获取到参数后,进行相应后续逻辑
getHeight(position: Cesium.Cartographic)
获取某经纬度点位的海拔高度,不要批量调用该方法,会造成并发而卡顿,若要批量获取,请使用getHeights
getHeights(position: Cesium.Cartographic[])
批量获取海拔高度,数量也不要过多,会收到Cesium的请求限制
cameraTo(lng: number,lat: number,height: number,heading = 90,pitch = -90,roll = 0)
摄像机切换至指定位置
cameraFlyTo(lng: number,lat: number,height: number,heading = 90,pitch = -90,roll = 0,duration: number = 3,complete?: Cesium.Camera.FlightCompleteCallback)
摄像机飞行至指定位置
addEventListener(action: Cesium.ScreenSpaceEventType, callback: (object: any) => void)
callback:(回调函数,会传回触摸到的实体,如果没有,则返回undefined)
绑定交互事件
removeEventListener(action: Cesium.ScreenSpaceEventType)
解绑交互事件