最近刚好在出来cesium的飞行动画,在实现过程中发现可以以czml格式的json数据来描述控制飞行参数,刚好借由这个契机对基础的czml格式进行学习
CZML格式数据作用
Cesium团队为了描述动态场景专门制定了CZML数据格式,可以描述气象数据,模型运动轨迹等等,而且CZML中的参数也可以描述实体的位置,速度,方向等信息。
CZML格式数据解释
- 每段czml数据都可以是一套json数据
- 以下注释解释中 时间的定义是采用ISO8601标准字符串
[
// 每一个对象可以代表一个动态场景
{
// 这段动态场景的唯一标识
"id": "sceneName"
// 描述该段数据时在什么时间可以使用的
availability: '2024-03-08T10:00:00Z/2023-03-08T15:00:00Z',
// 描述行为的开始和结束时间
clock: {
// 标识两个时间间隔
interval: '2023-03-08T10:00:00Z/2023-03-08T15:00:00Z',
// 设置场景当前时间
currentTime: '2023-03-08T10:00:00Z',
// 多久执行完上面时间区间的行为
multiplier: 10,
},
// 模型参数描述
model: {
// 需要加载的gltf,glb格式模型
gltf: 'xxx.glb',
minimumPixelSize: 1000,
maximumScale: 20,
},
// 描述实体的运动轨迹,position 和 orientation 的变化 [path是几何类型,可以是box等等]
path: {
// 定义材质
material: {
polylineGlow: {
color: {
rgba: [0, 0, 255, 200],
},
glowPower: 0.1,
taperPower: 0.1,
},
},
width: 20,
leadTime: 0,
trailTime: 1000,
resolution: 0.5,
show: true,
},
// 描述模型方向信息
"orientation": {
// 根据位置信息自动进行四元数方向转换
"velocityReference": '#position',
// 或者自己声明
"unitQuaternion": [
0.3084011337938999, 0.3210181022701266,
-0.45850421987074924, 0.7686388857813198
]
},
// 在gis中的初始位置
"position": {
// 插值算法
interpolationAlgorithm: 'LAGRANGE',
interpolationDegree: 5,
epoch: '2023-03-08T10:00:00Z',
"cartographicDegrees": [
0, 118.93830177292894, 25.488280583435404, 0,
300, 119.14034602637892, 25.32388938213355, 2000,
]
},
// 在cesium中绘制初始位置的点样式等信息
"point": {
"color": { "rgba": [0, 0, 255, 255] },
},
// someProperty 标识两个时间间隔,注意时间模式时区时UTC(中国时UTC+8,北京时间)
// 例如第一条是4月30 中午12点到下午1点 ,第二条是5月1 中午1点到下午2点
// 启动时间动画时,当时间到了5月1时,数值会由5变成6
// 特例:对于所有时间内容不变 可以"someProperty": 5
"someProperty": [
{
"interval": "2024-04-30T12:00:00Z/13:00:00Z",
"number": 5
},
{
"interval": "2024-05-01T13:00:00Z/14:00:00Z",
"number": 6
},
],
// 复合值:例如描述笛卡尔坐标/颜色等, 合成值必须定义在间隔中
"someComplexProperty":{
"cartesian":[1.0, 1.0, 1.0]
},
// 属性值采样
// 例如:12点时候属性值为[1.0,2.0,3.0],一分钟后变成[4.0,5.0,6.0]
"someInterpolatableProperty":{
"cartesian": [
"2012-04-30T12:00Z",1.0,2.0,3.0,
"2012-04-30T12:01Z",4.0,5.0,6.0
],
// 定义了采样使用的算法
// LAGTANGE
// HERMITE
// GEODESIC
"interpolationAlgorithm": "LAGRANGE",
// `定义了用来插值所使用的`多项式的次数
// 1.表示线性差值,2表示二次插值法
"interpolationDegree": 1,
// previousTime,nextTime二选一 ,作用解释见 ## 数据传输模式
"previousTime": -1.0,
// 告诉浏览器下一个时间段,如果上面还有内容没全则等待数据回来
"nextTime": 4.0
},
// 或者写法2
"someInterpolatableProperty":{
// 标识开始时间
"epoch": "2012-04-30T12:00Z",
// 4个值为一个维度,第一个时切换当条数据的描述,例如时间预先到12点1分时数据切换为4,5,6
"cartesian": [
0.0,1.0,2.0,3.0,
60.0,4.0,5.0,6.0
]
},
},
...
]
数据传输模式
由于czml数据定义内容比较多,假设我们一次性将所有数据都放在一个czml格式数据数组中,那么必然会影响程序的执行响应速度
方案一:
使用websocket 增量更新czml数据,每次都给最新状态的czml数据
方案二:
通过sse方案,后端通知前端响应