Cesium可视域分析

继续开始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包就可以使用了。