欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Cesium可视域分析

程序员文章站 2022-06-15 23:37:27
yin...

继续开始Cesium的学习之旅。

一、简介

因为也没查到关于可视域分析的明确定义,所以就按自己的话来说一下了。对三维空间而言,可视域分析就是指在某种场景下,基于某一个观察点,以一定的水平视角、垂直视角以及指定的视域范围等信息,来分析得到该区域所有通视点集合的过程。

简单来讲,可视域分析就像人的眼睛看东西一样,我们站在某一点,朝着一个方向看去,能看到的东西就是我们所得到的通视点集合。

二、代码实现

2.1相关参数

构建方式:

new Cesium.ViewShed3D(scene)

Cesium可视域分析

Cesium可视域分析

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();
	})

实现效果:
Cesium可视域分析

参考资料: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

相关标签: Cesium