github可视化_Cesium数据可视化-仓储调度系统可视化部分(附github源码)

Cesium数据可视化-仓储调度系统可视化部分

目的

仓储调度系统需要一个可视化展示物资运输实况的界面，需要配合GPS设备发送的位置信息，实时绘制物资运输情况和仓储仓库。因此，使用Cesium可视化该数据。

说明

这只是开发过程中的原型系统。

原理简介

点，线，图片的绘制就不细说了。

动态点绘制是利用Entity的position属性可以制定某时间点的出现位置，形成动画效果。

核心代码如下：

/** 
         * 计算 property 
         * @param source 
         * @returns {SampledPositionProperty|*} 
         */ 
 function computeFlight(source) { 
 // 取样位置 相当于一个集合 
 var property = new Cesium.SampledPositionProperty(); 
            property.setInterpolationOptions({ 
                interpolationAlgorithm: Cesium.LagrangePolynomialApproximation, 
                interpolationDegree: 2 
            }); 
 for (var i = 0; i < source.length; i++) { 
 var time = Cesium.JulianDate.addSeconds(start, source[i].time, new Cesium.JulianDate); 
 var position = Cesium.Cartesian3.fromDegrees(source[i].longitude, source[i].dimension, source[i].height); 
 // 添加位置，和时间对应 
                property.addSample(time, position); 
            } 
 return property; 
        }


// 动态点 
            viewer.entities.add({ 
                position: property, 
                name: "复兴号", 
                description: "运载量：100t", 
                path: { 
                    show: true, 
                    leadTime: 0, 
                    trailTime: 10, 
                    width: 5, 
                    resolution: 5, 
                    material: new Cesium.PolylineOutlineMaterialProperty({ 
                        color: Cesium.Color.fromAlpha(Cesium.Color.RED, 1), 
                        outlineWidth: 1, 
                        outlineColor: Cesium.Color.red 
                    }) 
                }, 
                availability: new Cesium.TimeIntervalCollection([new Cesium.TimeInterval({ 
                        start: Cesium.JulianDate.addSeconds(start, data[j][0].time, new Cesium.JulianDate), 
                        stop: Cesium.JulianDate.addSeconds(start, data[j][data[j].length - 1].time, new Cesium.JulianDate), 
                        isStartIncluded: true, 
                        isStopIncluded: false, 
                        data: Cesium.Cartesian3.fromDegrees(110, 39) 
                    })] 
                ) 
            }); 

具体详情读源码即可

更多详情见下面链接：

Cesium数据可视化-仓储调度系统可视化部分(附github源码) － 小专栏​xiaozhuanlan.com

文章尾部提供源代码下载，对本专栏感兴趣的话，可以关注一波

GIS之家店铺：GIS之家

GIS之家源码咨询：GIS之家webgis入门开发系列demo源代码咨询