三维风场实现 三维风场实现
当前风场数据在cesium中展示有比较多的实现方法,例如可以使用3D-Wind-Field使用自定义DrawCommand绘制,也可以使用leaflet-velocity,基于canvas绘制来实现可视化效果,本文基于前者代码并做了一些改动
2025-01-03
Drawcommand的批量实例化 Drawcommand的批量实例化
最近遇到一个需求,后端在给定范围里面生成了几万个格子,我需要根据这些数据绘制三层同样的格子并在前端展示出来,三层近十万个格子如果用geometryInstances绘制的话会出现页面阻塞的情况,导致页面浏览效果不是很好,需要优化一下加载速度
2024-12-16
流体可视化 流体可视化
基于cesium实现的流体渲染效果,shaderToy上面有很多关于流体渲染相关的例子,将这些效果移植到cesium上面可以在一定程度上增强水体淹没等三维可视化展示效果。本文结合网上各位大佬的例子,基于高度图采样实现流体渲染,大致思路如下
2024-09-12
爆炸效果实现 爆炸效果实现
基于cesium实现的体渲染爆炸效果 思路实现思路和之前的复刻柏林噪声类似都是体渲染,shader参考的是shaderToy上面的爆炸效果,可以查看下方参考链接 效果展示 参考链接Cesium 体积爆炸效果 体积火 体积烟雾
2024-05-30
高度雾及流动效果实现 高度雾及流动效果实现
基于高度实现的雾效果,可以在一定程度上优化场景展示,本文基于cesium实现了一版线性高度雾并在此基础上添加了流动效果,大致思路如下 思路1、纹理坐标还原成世界坐标2、计算世界坐标相对于地面的高程值,以及相机坐标与片元之间的距离,并根据高程
2024-02-02
后处理实现积雪效果 后处理实现积雪效果
cesium有两种思路实现积雪效果,一种渲染在模型等上面,另外一种则是通过后处理的方式。两种方式原理基本相同,但是效果范围以及修改方式有差别,各有取舍吧,本文采用的是后处理方式实现积雪效果 思路1、根据纹理坐标还原世界坐标,将其单位化当作片
2024-02-01
阴影率分析 阴影率分析
cesium阴影率分析的思路大概有两种,一是开启光照并生成格网点,时钟每tick一次记录太阳的位置,构造格网点到太阳位置的射线,通过射线求交的方法计算累计光照量,但这种方法比较耗时间且复杂,二是通过shadowMap来计算,本文采用的是第二
2024-01-04
气象数据体渲染 气象数据体渲染
气象数据的体渲染思路和上一篇复刻柏林噪声类似,都是采用三维纹理方式实现采样渲染的,但这里需要注意的是大范围的BoxGeometry在自定以的dc里面传入dimension,进行采样的时候会报错,可能是数据维度太大的问题,需要变换模型矩阵,编
2023-12-17
复刻柏林噪声 复刻柏林噪声
Three.js里面有很多关于体渲染的例子,柏林噪声就是其中比较好的一个。在cesium中复刻这个效果,采用的是直接构建三维纹理,对模型坐标进行采样渲染,大致思路如下 思路1、修改cesium源码使其能够支持三维纹理,同时编写三维纹理类2、
2023-12-16
1 / 2