Line of Sight Integration in Cesium
What is line of sight?
Line of sight is a powerful tool for both urban planning and signal engineering. It means a line from an observer’s eye to a distant point, or the signal path between a transmitter and a receiver. It would reveal the direction and distance of the sight (signal) block point. In urban planning, it could be an examining tool to check whether the view of a landmark has been blocked. In signal engineering, it could check whether receiver could receive the signal at a certain location.
Line of sight from St Patrick's Cathedral
How to compute line of sight?
Considering that light travels as straight lines, image you have a source of light that emanates light lines to many directions. Those lines can be considers as lines of sight. Each line has a start point, hit point and end point. if we have a start point and an end point, then the question of computing a line of sight will change to a mathematical question about how we calculate the hit point that is the point where a vector intersects an object. In Cesium, we can use Cesium.Ray(origin, direction) to represent vector with a source point and direction. And with the method scene.pickFromRay(ray, entities) we can get the first intersected point.
/** * * @param {*} dataSource Cesium.DataSource the entities that you don't want to exculded in the hit measurement * @param {*} positionData is an array contains [startPoint, startPoint], both are Cesium.Cartesian3 */ var drawSightViewLine= function (dataSource, positionData) { var direction = Cesium.Cartesian3.normalize( Cesium.Cartesian3.subtract(positionData[1], positionData[0], new Cesium.Cartesian3()), new Cesium.Cartesian3()); var ray = new Cesium.Ray(positionData[0], direction); var objectsToExclude = []; var result = viewer.scene.pickFromRay(ray, dataSource.entities.values); if (result !== undefined) { dataSource.entities.add({ polyline: { positions: [positionData[0], result.position], arcType: Cesium.ArcType.NONE, width: 30.0, material: new Cesium.PolylineGlowMaterialProperty({ color: Cesium.Color.DEEPSKYBLUE, glowPower: 0.05, }), depthFailMaterial: new Cesium.PolylineGlowMaterialProperty({ color: Cesium.Color.DEEPSKYBLUE, glowPower: 0.05, }), } }); dataSource.entities.add({ polyline: { positions: [result.position, positionData[1]], arcType: Cesium.ArcType.NONE, width: 3, material: new Cesium.PolylineOutlineMaterialProperty({ color: Cesium.Color.RED, outlineWidth: 0 }), depthFailMaterial: new Cesium.PolylineOutlineMaterialProperty({ color: Cesium.Color.RED.withAlpha(0.5), outlineWidth: 0 }) } }); } else { dataSource.entities.add({ polyline: { positions: positionData, arcType: Cesium.ArcType.NONE, width: 30.0, material: new Cesium.PolylineGlowMaterialProperty({ color: Cesium.Color.DEEPSKYBLUE, glowPower: 0.05, }), depthFailMaterial: new Cesium.PolylineGlowMaterialProperty({ color: Cesium.Color.DEEPSKYBLUE, glowPower: 0.05, }), } }); } };
Demo
How to create line of sight?
First left click to add the sight location
Continue left click to add end points to create line of sight
Right click to end
Credit: Yibo Zhang, Centre for Spatial Data Infrastructures and Land Administration (CSDILA), The University of Melbourne
Email: yibo.zhang1@unimelb.edu.au