Cesium可视域分析
程序员文章站
2022-03-04 13:09:33
yin...
继续开始Cesium的学习之旅。
一、简介
因为也没查到关于可视域分析的明确定义,所以就按自己的话来说一下了。对三维空间而言,可视域分析就是指在某种场景下,基于某一个观察点,以一定的水平视角、垂直视角以及指定的视域范围等信息,来分析得到该区域所有通视点集合的过程。
简单来讲,可视域分析就像人的眼睛看东西一样,我们站在某一点,朝着一个方向看去,能看到的东西就是我们所得到的通视点集合。
二、代码实现
2.1相关参数
构建方式:
new Cesium.ViewShed3D(scene)
2.2实现过程
1、创建相关的实例,并添加图层。
var viewer = new Cesium.Viewer('cesiumContainer'); //创建容器
viewer.imageryLayers.addImageryProvider(new Cesium.BingMapsImageryProvider({
url: 'https://dev.virtualearth.net',
mapStyle: Cesium.BingMapsStyle.AERIAL,
key: URL_CONFIG.BING_MAP_KEY
}));
var scene = viewer.scene;
scene.globe.depthTestAgainstTerrain = true;
var camera = scene.camera;
//添加S3M图层服务
var promise = scene.open(URL_CONFIG.SCENE_NIAOCHAO); //返回一个异步加载对象
promise.then(function (layers) { //使用这个异步加载对象执行加载图层的操作
camera.setView({
destination: Cesium.Cartesian3.fromDegrees(116.3801, 39.9874, 12.0),
orientation: {
heading: 6.260995919619558,
pitch: 0,
roll: 0
}
});
});
2、创建可视域分析对象,实现可视域分析。
//实现可视域分析功能
$('#loadingbar').remove(); //删除进度条
$("#toolbar").show(); //显示工具条
if (!scene.pickPositionSupported) { //判断是否支持选择深度位置
alert('不支持深度纹理,可视域分析功能无法使用(无法添加观测)!');
}
// 先将此标记置为true,不激活鼠标移动事件中对可视域分析对象的操作
scene.viewFlag = true;
//创建绘制处理器对象,支持栅格化面对象的绘制,(容器对象,绘制模式(点、线、面),绘制风格)
var pointHandler = new Cesium.DrawHandler(viewer, Cesium.DrawMode.Point);
// 创建可视域分析对象
var viewshed3D = new Cesium.ViewShed3D(scene);
document.getElementById("chooseView").onclick = function () { //通过DOM构造来获取chooseView控件
if (pointHandler.active) {
return;
}
//先清除之前的可视域分析
viewer.entities.removeAll();
viewshed3D.distance = 0.1;
scene.viewFlag = true;
//激活绘制点类
pointHandler.activate();
};
pointHandler.drawEvt.addEventListener(function (result) { //绘制完成事件,监听绘制完成的事件,获取当前绘制结果
var point = result.object;
var position = point.position;
// 将获取的点的位置转化成经纬度
var cartographic = Cesium.Cartographic.fromCartesian(position);
var longitude = Cesium.Math.toDegrees(cartographic.longitude);
var latitude = Cesium.Math.toDegrees(cartographic.latitude);
var height = cartographic.height + 1.8; //将观测点的高度向上移动1.8米,类似于人眼睛的位置
if (scene.viewFlag) {
// 设置视口位置
viewshed3D.viewPosition = [longitude, latitude, height];
viewshed3D.direction=0;
viewshed3D.distance=100;
viewshed3D.hiddenAreaColor=Cesium.Color.BLUEVIOLET;
viewshed3D.hintLineColor=Cesium.Color.BLUE;
viewshed3D.visibleAreaColor=Cesium.Color.AQUA;
viewshed3D.horizontalFov=90;
viewshed3D.pitch=0;
viewshed3D.verticalFov=90;
viewshed3D.build();
// 将标记置为false以激活鼠标移动回调里面的设置可视域操作
scene.viewFlag = false;
}
});
$("#clear").on("click", function () {
viewer.entities.removeAll();
viewshed3D.distance = 0.1; //无法直接清除viewshed3D对象,所以选择将其视域半径置为0.1
scene.viewFlag = true;
pointHandler.clear();
})
实现效果:
参考资料:http://support.supermap.com.cn:8090/webgl/examples/editor.html#viewshed3D
注:上面所说的可视域分析功能,是使用了超图公司基于Cesium框架二次封装之后的API,所以官方的Cesium API中可能会没有文中提到的一些相关的API函数,如果有兴趣的话可以到超图官网上下载相应的Cesium包就可以使用了。
本文地址:https://blog.csdn.net/dayuhaitang1/article/details/107513754