携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第1天，点击查看活动详情
效果展示
- 卫星轨道模拟
- 扫描条带模拟
- 卫星过顶通信模拟
- 卫星实时位置显示
由于卫星领域是一个全新的领域，可能对于绝大部分从事软件开发的人都是陌生的。所以，接下来会先介绍一些这个项目开发过程中所必须的基础知识。比如[TLE](https://en.wikipedia.org/wiki/Two-line_element_set)（两行轨道数据）、CZML（一种用来描述动态场景的JSON架构的语言）等。
Cesium入门
CesiumJS是一个用于Web上3D地图的JavaScript库。开发者通过Cesium，实现无插件的创建三维球，Cesium通过WebGL技术实现图形的硬件加速，并且跨平台，跨浏览器。而我恰巧有一个实现卫星三维模拟的需求，便选用了Cesium这一个框架。
关于Cesium的环境搭建以及例子，这里便不在讲废话，倘若有有缘人恰好看到我的博文，可以直接去官方文档结合官方沙盘示例入门。
此外，前后端分离开发，这里推荐一个vscode的小插件，Live Server，在我进行Cesium开发的时候十分好用。
TLE介绍
想必读者也会好奇卫星轨道数据该如何表示？答案就是TLE（两行轨道数据）。严格来讲，TLE描述的是卫星的星历信息，而轨道数据则是通过TLE这种星历信息计算出来的一种CZML形式的数据（至于CZML是个啥？下文在进行介绍）。
BEIDOU 3
1 36287U 10001A 21187.60806788 -.00000272 00000-0 00000-0 0 9992
2 36287 1.9038 47.2796 0005620 82.9429 153.9116 1.00269947 42045
格式就是这个样子，而这短短几十个字符便可以看成是一颗卫星的全部，感兴趣可以维基百科看一下各个字段的具体含义。
我们的卫星轨道CZML格式便是从TLE的字段中解析而来的。
CZML介绍
CZML是一种用来描述动态场景的JSON架构的语言，主要用于Cesium在浏览器中的展示。它可以用来描述点、线、布告板、模型以及其他的图元，同时定义他们是怎样随时间变化的。
[{
"id": "document",
"version": "1.0",
"clock": {
"currentTime": "2022-06-27T06:25:42.089508+00:00",
"multiplier": 60,
"interval": "2022-06-27T06:25:42.089508+00:00/2022-06-28T06:25:42.089508+00:00",
"range": "LOOP_STOP",
"step": "SYSTEM_CLOCK_MULTIPLIER"
}
}, {
"id": "Satellite/demo",
"description": "Orbit of Satellite: demo",
"availability": "2022-06-27T06:25:42.089508+00:00/2022-06-28T06:25:42.089508+00:00",
"billboard": {
"show": true,
"image": "data:image/png;base64,iVBORw0KGgoAAAANSUhE......",
"scale": 1.5
},
"position": {
"epoch": "2022-06-27T06:25:42.089508+00:00",
"cartesian": [0.0, -117634.11811073966, -2818367.424703898, 6294335.6550507955, 300.0, -749701.243841011, -701453.1874775941, 6820705.55321546, 600.0, ......, 87600.0, 3400008.6423068987, -4038704.7997197313, -4460639.643591208],
"interp olationAlgorithm": "LAGRANGE",
"interpolationDegree": 5,
"referenceFrame": "INERTIAL"
},
"label": {
"show": true,
"text": "demo",
"horizontalOrigin": "LEFT",
"pixelOffset": {
"cartesian2": [12, 0]
},
"fillColor": {
"rgba": ["213", "255", "0", 255]
},
"font": "11pt Lucida Console",
"outlineColor": {
"rgba": [0, 0, 0, 255]
},
"outlineWidth": 2
},
"path": {
"show": [{
"interval": "2022-06-27T06:25:42.089508+00:00/2022-06-28T06:25:42.089508+00:00",
"boolean": true
}],
"width": 1,
"leadTime": [{
"interval": "2022-06-27T06:25:42.089508+00:00/2022-06-27T06:35:14.150516+00:00",
"epoch": "2022-06-27T06:25:42.089508+00:00",
"number": [0, 5721.862599441874, 5721.862599441874, 0]
}, ...... ],
"trailTime": [{
"interval": "2022-06-27T06:25:42.089508+00:00/2022-06-27T06:35:14.150516+00:00",
"epoch": "2022-06-27T06:25:42.089508+00:00",
"number": [0, 0, 5721.862599441874, 5721.862599441874]
}, ...... ],
"resolution": 120,
"material": {
"solidColor": {
"color": {
"rgba": ["213", "255", "0", 255]
}
}
}
}
}]
至于TLE具体怎么转化为CZML的？ 下期在更，吃饭去了。。。
