![](https://img-blog.csdnimg.cn/3316103650d542348d4b94b6cd6d1473.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
Cesium
文章平均质量分 51
WebGIS 二三维开发经验总结
优惠券已抵扣
余额抵扣
还需支付
¥159.90
¥299.90
购买须知?
本专栏为图文内容,最终完结不会低于15篇文章。
订阅专栏,享有专栏所有文章阅读权限。
本专栏为虚拟商品,基于网络商品和虚拟商品的性质和特征,专栏一经购买无正当理由不予退款,不支持升级,敬请谅解。
seelingzheng
这个作者很懒,什么都没留下…
展开
-
Cesium材质之Fabric
Fabric是Cesium中用于描述材质的一种JSON规定,使用Fabric和GLSL可以方便的定义材质。定义一个简单的Fabric对象,需要配置typeuniforms,两个属性,如果需要自定义着色器,需要添加source属性。如下为创建一个简单的Fabric**type:**用于定义材质的类型,使用的时候可以直接通过来指定定义好的材质。设置该参数,可以复用材质,传入一个不存在的 type类型之后,这个材质将被缓存下来。下次调用或者就会引用缓存里的材质,不需要再传入Fabric对象。原创 2023-03-30 01:02:28 · 314 阅读 · 0 评论 -
Cesium 时间轴格式化
两个方法重写修改返回值得到。因为两个方法均会返回。日期对象,可以从该对象获取相关的时间信息。原创 2023-03-27 23:23:08 · 379 阅读 · 0 评论 -
版本到102之后,雨雪效果报错,着色器修改
类的封装 引用的是别人写的,当时只是为了测试 所以就网上找了一个 https://blog.csdn.net/chudage11/article/details/115185574。这个类的解析做了处理,所有直接下载最新版本看了一下发现有个三个地方做了变动,如图所示,按此修改完之后,即可。也就是片元着色器中的第二行。因为自己本地的版本是。通过此验证说明是代码升级之后,cesium对这个。通过提示可以看出 使用了系统保留字。原创 2023-02-17 14:17:40 · 341 阅读 · 0 评论 -
Cesium 顶点着色器修改
通过上一篇文章的学习,我们只是实现了,对的修改,当我们想要实现一个三维的热力图的时候,就需要涉及到对顶点着色器的修改,因为cesium体系里面有着一套属于自己的构建glsl的方式,所有当我们要想修改顶点着色器,就不会像在threejs里面用起来那么顺手,这篇文章主要是讲解一下怎么去修改顶点着色器,简单实现。原创 2023-02-16 23:58:23 · 653 阅读 · 0 评论 -
Cesium 着色器渲染简单实现
的方式来创建一个平面,然后通过自定义材质的方式来做平面渲染。的方式来创建一个平面 geomentry。的方式来创建渲染材质。原创 2023-02-14 22:59:59 · 468 阅读 · 0 评论 -
cesium 常用函数
【代码】cesium 常用函数。原创 2023-02-06 18:07:46 · 146 阅读 · 0 评论 -
Cesium 修改球体
这是因为在使用超图封装出来的webgl的时候,他们是吧球体做了变化,所有如果想在cesium里面加载通过supermap处理出来的数据的时候,需要修改一下球体,修改成正球体,而cesium使用的是扁球体。还有就是超图以及开源了s3mb格式数据加载方式,可以官方下载对应的js包,引入就可以在cesium中使用超图处理出来的数据了。可以参看这个github。原创 2023-02-06 18:07:25 · 346 阅读 · 0 评论 -
cesium中 shader 使用
【代码】cesium中 shader 使用。原创 2023-02-06 18:06:57 · 291 阅读 · 0 评论 -
Entity 通过 Property 设置相关属性
在上一篇 介绍 Entity 样式设置的文章中,设置颜色渐变中使用到了,这篇会做一个详细介绍,在Entity属性怎样使用Property机制。原创 2023-02-06 18:08:31 · 181 阅读 · 0 评论 -
obj 与 fbx 三维模型文件对比
fbx2020 …fbx 格式(wiki)是 Autodesk 公司出品的支持动画的三维模型交换格式(详见:FileFormat-fbx)。obj 格式(wiki chs)是由 Wavefront 公司出品的三维模型文本交换格式(详见:FileFormat-obj)。示例模型下载:https://wiki.unrealengine.com/File:ThirdPerson_FBX.zip。可使用 QuickTime、FBX Review、visual studio 可视化该模型格式。原创 2023-02-05 20:54:56 · 1773 阅读 · 0 评论 -
Cesium 和 webgl 加载各类型模型说明
glb:是个二进制文件格式, 实现三维模型存储于 GL 的可传输的格式(glTF). 内含节点层级、摄像机、材质、动画、网格物体都用二进制存储。这个二进制格式存储 glTF 的组件(JSON,.bin 以及图片) . 同时也避免了用 glTF 格式文件变大的问题. 通过压缩, GLB 能更快地加载, 提供完整的三维场景, 且是能在未来的开发中扩展的. 该格式使用 model/gltf-二进制文件作为 MIME 类型。Glsl 文件:是简单脚本,应该是用来解析自己在 gltf 中增加的项目的;原创 2023-02-05 20:54:26 · 770 阅读 · 0 评论 -
cesium 位置,旋转,高度 修改
【代码】cesium 位置,旋转,高度 修改。原创 2023-02-05 20:52:42 · 828 阅读 · 0 评论 -
Cesium Entity 样式设置
【代码】Cesium Entity 样式设置。原创 2023-02-05 19:31:14 · 210 阅读 · 0 评论 -
Cesium 坐标相互转换
cesium中常用的坐标有两种WGS84地理坐标系和笛卡尔空间坐标系(世界坐标)。WGS84坐标一般以经纬度来指明一个地点,原点在椭球的质心。笛卡尔空间坐标系常用来做一些空间位置变换如平移旋转缩放等等,坐标原点在椭球的中心。屏幕坐标----------------------------------------------->Pick世界坐标----------------------------------------------->Cartesian。原创 2023-02-05 19:29:39 · 290 阅读 · 0 评论 -
Cesium Entity API 使用
【代码】Cesium Entity API 使用。原创 2023-02-05 19:29:44 · 107 阅读 · 0 评论 -
Cesium ImageryProvider 服务
【代码】Cesium ImageryProvider 服务。原创 2023-02-05 19:29:17 · 200 阅读 · 0 评论 -
Cesium 初始化Viewer基本配置参数说明
fabric : {color : new Cesium . Color(1.0 , 1.0 , 1.0 , 1.0) , image : "图片路径" } } });原创 2023-02-05 19:28:24 · 338 阅读 · 0 评论 -
Cesium 初始化项目(Vue2.x)
在项目根目录新增配置文件 vue.config.js,如下。原创 2023-02-05 19:28:24 · 81 阅读 · 0 评论 -
Cesium ion 在线资源调用
Cesium ion支持把数据添加到用户自己的CesiumJS应用中。Cesium ion是一个提供瓦片图和3D地理空间数据的平台,ion个人账号提供了5g的存储空间,可以用来存储自己的数据。原创 2023-02-05 19:27:14 · 567 阅读 · 0 评论 -
Cesium knockout中的监控属性getObservable
在开发的过程可以理解为Cesium.knockout继承于Knockout.js,比如getObservable是Cesium.knockout独有的,ko没有。在查找相关使用说明的时候可以参考Knockout.js中的相关案例和方法,结合使用。原创 2023-02-06 18:09:29 · 234 阅读 · 0 评论 -
Cesium 中的常用坐标系及说明
Cesium中常用的坐标系主要有两种:WGS84坐标系和笛卡尔空间直角坐标系。平时我们常见的某个点的经纬度就是在WGS84坐标系下某个点的坐标,它的坐标原点在椭球的质心;而笛卡尔坐标系主要是用来做空间位置的变化如平移、旋转和缩放等等,它的坐标原点在椭球的中心。除此之外,还有不常用的坐标系:1、平面坐标系(Cartesian2);2、笛卡尔空间直角坐标系(Cartesian3);原创 2023-02-04 01:00:13 · 835 阅读 · 0 评论 -
Cesium中添加GIF图片
Cesium官方给了将视频投影到几何体的Demo,不得不说第一眼看到还是比较惊艳的,那么Cesium能不能将gif图片也投影到几何体呢,答案是不能像视频一样直接投影,但是如果我们借助一些其它工具,还是能实现这个功能的。下面以billboard加载gif图片为例展开说明,如果你要投影到其它图形,原理都是一样的。Cesium Billboard如何加载gif图片?原创 2023-02-04 00:57:31 · 807 阅读 · 0 评论 -
cesium 热力图
通过 heatmap.js 生成热力图,然后通过图片的方式贴到 cesium 中。原创 2023-02-04 00:56:41 · 323 阅读 · 0 评论 -
cesium 热力图
通过 heatmap.js 生成热力图,然后通过图片的方式贴到 cesium 中。原创 2023-02-04 00:54:47 · 134 阅读 · 0 评论 -
Cesium 加载Primitive数据
(1)性能:绘制大量Primitive时,可以将其合并为单个Geometry以减轻CPU负担、更好的使用GPU。合并Primitive由web worker线程执行,UI保持响应性(2)灵活性:Geometry与Appearance 解耦,两者可以分别进行修改(3)低级别访问:易于编写GLSL 顶点、片段着色器、使用自定义的渲染状态外观定义了需要在GPU上执行的完整的GLSL顶点、片段着色器,通常不需要修改这一部分,除非需要定义自己的外观。原创 2023-02-04 00:53:47 · 822 阅读 · 0 评论 -
Cesium 生成terrain地形数据
注意:执行前请确保输出文件夹存在且是空的,同时保证磁盘有足够的空间,全球数据大约800G。生成瓦片的等级不要太高,中国范围内单18级就需要大约700G。打开 ArcToolbox->Data Management Tools->Raster->Raster Dataset ->Mosaic。由于CTB工具不支持DEM为NoData值和float的数据,所以需要对数据进行处理。将ctb和gdal-data拷贝至合适的目录下如:D:\soft\CTB。这个过程更加费时间,需要等待很久,直到执行结束。原创 2023-02-04 00:49:16 · 718 阅读 · 0 评论 -
扩展 Geocoder 调用高德API查询POI数据
Geocoder 是一个非常简单的控件,但也是非常常用且实用的控件,顾名思义,Geocoder 就是地理编码的意思,而平常我们经常会查询一些地物,也就是常用的 POI 搜索,就是 Geocoder 的功劳。原创 2023-02-04 00:45:46 · 153 阅读 · 0 评论 -
Cesium 自定义BaseLayerPicker
除了使用baseLayerPicker中默认的地图数据源,我们可以使用cesium提供的ProviderViewModel接口自己扩展数据源。使用自定义图层,需要在初始化viewer的时候,需要开启。原创 2023-02-04 00:44:44 · 356 阅读 · 0 评论 -
Cesium 点位聚合
这里使用的是 cesium 沙盒演示中自带的数据进行实现。根据得到的 DataSource 对象配置聚合。添加到 viewer.dataSources。原创 2023-02-04 00:56:08 · 1265 阅读 · 0 评论 -
Cesium 绕点旋转
实际是通过修改 camera 对象 heading 属性值来实现对指定位置的绕点旋转。原创 2023-02-02 22:12:45 · 425 阅读 · 0 评论 -
Cesium事件
【代码】Cesium事件。原创 2023-02-02 22:11:53 · 253 阅读 · 0 评论 -
Cesium entity 属性 orientation
下面来看一个综合的应用,通过改变heading、pitch、roll来改变实体的姿态,Quaternion的获取通过headin、pitch、roll来转化,Cesium.Quaternion.fromHeadingPitchRoll(Cesium.HeadingPitchRoll.fromDegrees(heading,pitch,roll))。orientation属性设置的值类型为Quaternion四元数,由x、y、z、w分量构成,其中w分量为时间分量,这节课程先不涉及。原创 2023-02-02 22:11:38 · 605 阅读 · 0 评论 -
Cesium entity 属性 orientation
下面来看一个综合的应用,通过改变heading、pitch、roll来改变实体的姿态,Quaternion的获取通过headin、pitch、roll来转化,Cesium.Quaternion.fromHeadingPitchRoll(Cesium.HeadingPitchRoll.fromDegrees(heading,pitch,roll))。orientation属性设置的值类型为Quaternion四元数,由x、y、z、w分量构成,其中w分量为时间分量,这节课程先不涉及。原创 2023-02-02 22:10:30 · 2035 阅读 · 0 评论 -
Cesium 鼠标操作习惯设置
Cesium默认左键平移,中键旋转,右键缩放,但是这些功能都是可以绑定到任意键上的。以下是将中键和右键功能互换的代码。原创 2023-02-02 22:10:05 · 274 阅读 · 0 评论 -
Cesium 加载CZML 数据
一个包还会有更多的属性用于描述这个对象的特性. 在上面这个例子中, 我们指定了一个id为"GroundControlStation" 的对象,这个对象拥有一个固定的WGS84坐标 (-75.5 ,40.0,0.0), 并在这个位置显示一个蓝色的点。CZML是一种JSON格式的字符串,用于描述与时间有关的动画场景,CZML包含点、线、地标、模型、和其他的一些图形元素,并指明了这些元素如何随时间而变化。定义了一个CZML后,就可以把它载入到场景中,就能获得该对象的动态效果。CZML 的一个典型结构如下。原创 2023-02-02 22:09:19 · 359 阅读 · 0 评论 -
Cesium 定位方法使用
在cesium中viewer.flyTo和Camera.flyTo的区别挺大,我们通常会用camera来定位,但当需要加上一个倾斜角的时候,可能定位的结果就和预想的区别很大需求:矩形的中心点位置(110.0,35.8)为想要定位的中心点位置,相机倾斜25度,相机距离中心点的位置为5000定位到点viewer.flyTo定位结果。原创 2023-02-02 21:51:18 · 1071 阅读 · 0 评论 -
【Leaflet开发】L.GridLayer 扩展
前序扩展 Girdlayer 是受 openlayer 提供的 ol.source.TileDebug 启发,因为 leaflet 是没有这样的 api,所以就想着做一个类似的插件最终实现效果L.Girdlayer L.GridLayer 是一个一般类,其用于 HTML 元素的格网切片。它是所有切片层(Tile Layer)的基类,且替换了之前版本的 TileLayer.Ca...原创 2020-05-04 15:09:54 · 1079 阅读 · 0 评论 -
【Python@GIS】在leaflet 加载 flask 后台数据 (二)
关注公众号"seeling_GIS",回复『前端视频』,领取前端学习视频资料完成效果图源码获取:关注公众号,回复:flask创建 ogr_geometry.py 文件# *_* coding:utf8 *_* from osgeo import ogr # wkt 转 geojson def create_wkt_to_geojson(wkt): ...原创 2020-03-11 09:40:02 · 328 阅读 · 0 评论 -
【Python@GIS】在leaflet 加载 flask 后台数据 (三)
关注公众号"seeling_GIS",回复『前端视频』,领取前端学习视频资料完成效果图新增绘制功能,并将绘制的绘制对象转化成geojson和wkt数据,并在右侧文本框中显示输出主要是调用了 ogr的 CreateGeometryFromJson方法修改 ogr_geometry.py 文件# *_* coding:utf8 *_* from osgeo impo...原创 2020-03-12 00:17:45 · 324 阅读 · 0 评论 -
【Python@GIS】在leaflet 加载 flask 后台数据 (一)
关注公众号"seeling_GIS",回复『前端视频』,领取前端学习视频资料因为前期项目一个小的需求,需要将已有的wkt数据在地图上叠加显示。处理的方式有很多,但是都感觉不是特别方便。因为在之前看到过有类是的在线处理工具,如geosjon生成工具和图层简化工具等,加上前段时间学习了flask,python开发 web的框架,所以想着集合flask 、gdal和leaflet做一个web端的转...原创 2020-03-11 00:46:42 · 361 阅读 · 0 评论