大家好,我是日拱一卒的攻城师不浪,致力于技术与艺术的融合。这是2024年输出的第36/100篇文章。
可视化&Webgis交流群+V:brown_7778(备注来意)
效果预览
前言
小伙伴A:博主,有没有Cesium
基础系列类教程,能够把大部分知识点串联起来的那种?
我之前是一个只接触过二维的前端,日常工作就是写写大屏
,后台管理
、H5
或者小程序
之类的,最近公司领导突然要求我学习一下Cesium,为公司后期一些三维项目开发做准备。
作为一个只会curd的前端,刚接触Cesium着实让我有点头大,一堆的API,一堆陌生的名词,如空间直角坐标系
,欧拉角
,3D Tiles
,倾斜摄影
,BIM模型
,矩阵
,geoJson
等等,这些我之前根本就没接触过。
所以我想有没有这样一个从基础教起的教程,让我一个普通前端能够快速入门Cesium,理解其中大部分常用的功能,并很快能够实战完成公司的项目呢?
我:额...
全网搜了一下,目前确实还没有比较基础且详细的Cesium教程,没有一个看了能够让开发者对Cesium有一个整体掌控的教程,那么,我认为,我可以去填补这个知识空缺
,因为我是三维开发的爱好者
,同时我对Cesium也很有兴趣。
前阵子,英伟达老总黄仁勋
在发布会上介绍,他们正致力于数字孪生
地球平台Earth-2
的研究,然而,Cesium也参与了其中,并发布了Cesium for Omniverse
插件,所以,我认为Cesium今后在GIS
、数字孪生
、全球仿真
等前沿领域肯定大有作为。
Cesium教程
接下来,介绍一下Cesium-V1版本
教程的目录大纲,内容从基础开始,由浅入深。
为什么是V1版本?因为这个教程是一个长期更新的教程,毕竟Cesium是一个庞大的知识体系,笔者想一口气全部理解并输出,并不是很现实,这也是为什么教程是图文,因为方便修改,更新,完善。
第一章
第一章主要是对Cesium做一个全面的介绍,包括它是什么,能做什么,它的架构体系,代码目录结构是怎样的,以及从零搭建一个Cesium + Vue3 + Vite
的初始项目。
再就是讲解一下Ceisum中常用到的一些GIS基础知识
。
第二章
第二章涉及的知识点就相对比较多了,包括三维中的相机
使用,各种地形
、影像
加载方式,都有哪些矢量数据
类型,如何使用,点线面
的构建,加载国产地图
以及加载各种3D模型
等等。
部分教程截图如下:
第三章
第三章主要跟日常业务开发相贴合,理解Ceisum中的各种事件,这是我们做三维交互所离不开的属性。
学会各种Colletion集合
的应用,提高代码可读性
,可维护性
等。
如何渲染一个三维汽车模型,如何让它按照自己设定的轨迹移动,Cesium中的动画
以及时间
概念等。
Primitive图元
,这个概念,你做Ceisum项目一定要知道,它是提高渲染性能的一大利器!特别是在渲染大量元素的时候。
在我的技术交流群
里,经常会有小伙伴问我,为什么他的项目里渲染点位
,页面总是特别卡顿。
我问他多少个点?他说七八千个
吧。
我问他,你是不是用Entity
渲染的,他说是,我说你去了解下Primitive,改成它去渲染,几十万
个点瞬间秒出!
小伙伴用了之后连连称赞,说这个API太牛了,页面瞬间就不卡了。
所以,有时候不是能力不行,而是认知没有跟上!
第四章
这一章是比较有难度的一章,因为涉及到写shader
,写着色器
,对于很多没有学过webgl
的小伙伴来说,一开始上手会比较费劲,但是书读百遍,其意自现,我也会不断的去打磨这一个模块,争取做到通俗易懂,也会写更多的案例
去让小伙伴不断的熟悉其中的奥义。
第五章
第五章主要是场景美化
以及一些开发时有帮助以及效率提升
工具的介绍等。
这一章其实也蛮有意思的,试想一下你把一个丑丑的影像一点一点变得高级美观起来,那甲方不得对你刮目相看呐!
毕竟,谁不喜欢看美女
呢?!
项目实战
当学完以上这些基础或者进阶篇之后,我们基本上就能一起从零到一去开发一个智慧城市
实战项目了,这个实战项目我也会提供源码给大家。
并且基本上每一个功能场景,我都封装成了一个大类,使用以及修改起来更加方便。
最后
如果对教程感兴趣的小伙伴可以联系我:brown_7778(备注来意)。
如果说你已经是Cesium高手了,但想进
可视化&Webgis交流群
也可以加我,我拉你进群装X。