4.Cesium通过GroundPrimitive实现流动水面效果

最新推荐文章于 2024-10-10 15:22:43 发布
最新推荐文章于 2024-10-10 15:22:43 发布
阅读量1.9k 收藏 8
点赞数 3
分类专栏： Cesium
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/skr_Rany/article/details/112887731
版权
本文介绍了如何使用Cesium的GroundPrimitive接口创建流动水面效果，避免了在地图缩放过程中可能出现的图像缺失问题。
摘要由CSDN通过智能技术生成

这里采用GroundPrimitive接口，如果采用Primitive接口，随地图放大缩小会出现缺失的情况

this.waterPrimitive = new Cesium.GroundPrimitive({
   
        show: true, // 默认隐藏
        allowPicking: false,
        geometryInstances: new Cesium.GeometryInstance({
   
          geometry: new Cesium.PolygonGeometry({
   
            polygonHierarchy:
最低0.47元/天 解锁文章
tyy_Rany
关注
专栏目录
cesium河流流水（cesium篇.63）
地图之家
12-03 3259
听老人家说：多看美女会长寿 地图之家总目录（订阅之前建议先查看该博客） 文章末尾处提供保证可运行完整代码包，运行如有问题，可“私信”博主。 效果如下所示： 下面献上完整代码，代码重要位置会做相应解释 <html lang="en"> <head> <meta charset="UTF-8"/> <script src="Build/Cesium/Cesium.js"></script> <link rel="st
Cesium垂直+水平含水管道实体
05-05
对应文章地址：https://blog.csdn.net/qq_39142804/article/details/124598158 Cesium三维管网模拟
cesium 实现流动效果(河流具有流向的流动效果)
m0_67531029的博客
04-07 2573
一、创建PolylineTrailLinkMaterialProperty.js文件。效果：粒子流动、河流流动、河面具有流向的流动。图片资源：三个随意取用其一。a、在原生html里面使用。b、在vue3中使用。
Cesium高阶学习七、反射水面
最新发布
程迷学习的博客
10-10 678
Cesium高阶学习七、反射水面
Cesium15-GroundPrimitive绘制贴地图形
m0_56492004的博客
03-18 1896
GroundPrimitive是Primitve的扩展，作用是帮助用户将几何图形贴地的类。GroundPrimitive中的几何图形必须来自单个几何图形，还不支持多个几何图形的批量处理。
Cesium贴地设置
热门推荐
sinat_41537539的博客
06-24 1万+
Cesium贴地设置 1.primitive贴地线 Cesium对primitive线有专门的GroundPolylinePrimitive贴地线primitive和GroundPolylineGeometry贴地线几何 viewer.scene.primitives.add( new Cesium.GroundPolylinePrimitive({//贴地primitive线 geometryInstances: new Cesium.GeometryInstance({ ge
cesium 绘制primitive流程（二）更新primitive
weixin_38398641的博客
10-08 5790
我们从下面图片去观察cesium是怎样触发primitive更新的 1，初始化cesium场景时候会默认执行CesiumWidget类里面的startRenderLoop方法，该方法的作用是 ![image](https://upload-images.jianshu.io/upload_images/17220164-2c366ce3f51a525e.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240) 调用浏览器requestAnimati
Cesium 使用primitive绘制几何图形，相机拉近（视野放大），几何图形破损显示不完整
大大大大大碗面
05-07 8436
分析：此原因是因为地形导致，可以尝试将primitive设置高程（高度）如5000m，此时图形位置由于高于山峰等地形，图形可以显示完整。但是如果几何图形必须要贴地（高度为0m）呢？解决方法：1.设置scene.globe.depthTestAgainstTerrain = false;即不进行地形深度测试，也就忽略了地形。这时可以正常显示几何图形。2.使用GroundPrimitive。顾名思义，...
Cesium实现线条流动效果.rar
10-10
4. **着色器（Shader）**：为了实现更复杂的流动效果，可能还需要自定义顶点着色器（Vertex Shader）和片段着色器（Fragment Shader）。着色器是运行在GPU上的程序，可以进行高度定制的图形渲染。例如，我们可以在...
62.（cesium篇）cesium水面波纹（动态水面）.zip
12-03
通过以上步骤，你可以在Cesium中实现动态水面效果。这个过程涉及到WebGL编程、数学模拟以及Cesium API的深度理解。如果你遇到任何问题，可以参考提供的博客链接或直接向博主提问。通过不断实践和学习，你将能够创建...
cesium 实现风场图效果
08-01
这可以通过设置`Cesium.TimeIntervalCollection`或使用`Cesium.CallbackProperty`在每一帧时更新粒子的属性来实现。 5. **加载风场数据**：可以使用Cesium的`Cesium Ion`服务，它提供了数据上传、处理和分发的功能...
Cesium边界流动线效果
09-01
"Cesium边界流动线效果"是指利用Cesium库来实现的一种动态视觉效果，通常用于表示地理空间数据中的路径或流动路径。这种效果可以用于展示如交通路线、飞行轨迹、河流流动等动态信息。 首先，我们要理解Cesium中的...
CESIUM例子学习（九）——Primitive(3)
luoyun620的博客
07-18 5738
geometry实在是太多了，多也要一个一个地学。学习的过程中不仅仅是用Primitive加载各种geometry。在这个过程中也加深对cesium的印象，至少混过脸熟，然后熟就能生巧。特别是学习这种事，要自己亲手去做去练习才能有更好的体会。 一、Polyline(线) cesium提供了SimplePolylineGeometry、PolylineGeometry、PolylineVolumeGeometry、PolylineVolumeOutlineGeometry、GroundP...
青理工大work总结知识点 2
PinPinAnan的博客
09-05 325
Globe绘制的是全球地形，它需要两个东西，一个是地形高程信息，另外一个是影像图层，也就是地球的表皮。整个地形的绘制也是渐进式的，即视线看到的地方才会去调度相关的地形高程信息，找到对应位置的地形影像贴上。Cesium中的地理坐标单位默认是弧度制，用Cartographic变量表示，可通过new Cesium.Cartographic(longitude, latitude, height)创建，其中这里的参数是用弧度表示的经纬度，即经度和纬度。图元是Cesium用来绘制三维对象的一个独立的结构。
Cesium原理篇：GroundPrimitive
weixin_34194551的博客
12-26 1820
       今天来看看GroundPrimitive，选择GroundPrimitive有三个目的：1 了解GroundPrimitive和Primitive的区别和关系 2 createGeometry的特殊处理 3 如何通过阴影体的方式实现贴地效果。 GroundPrimitive.prototype.update        可以认为GroundPrimitive是Primitive的扩...
Cesium管道流动材质
xt3d的博客
03-15 3423
Cesium管道流动材质 实现效果 详情参见 Cesium实战项目
【Cesium】 Primitive创建形状基础---贴地几何体
Wangzx的博客
12-03 1930
【代码】Cesium Primitive创建形状基础---贴地几何体。
[Cesium]Cesium基础学习——Primitive
警警的博客
05-14 989
来表达物体的外观特征，而这些外观特征是由漫反射(diffuse)、镜面反射(specular)、法向量(normal)、自发光(emission)以及透明度（alpha）组合（即一个Components）而成。（Shading），包括GLSL（OpenGL着色语言，OpenGL Shading Language）顶点着色器和片元着色器（ vertex and fragment shaders），以及渲染状态（render state）。两种MaterialProperty。则定义了Primitive的。
cesium 添加流动材质
treasurecp的博客
03-20 1901
1.添加PolylineTrailLinkMaterialProperty.js 文件。
cesium实现GroundPrimitive加载geojson线数据
06-07
要在Cesium中使用GroundPrimitive加载GeoJSON线数据，可以按照以下步骤进行操作： 1. 准备数据：将GeoJSON线数据准备好，并确保其符合GeoJSON规范。 2. 创建GroundPrimitive：使用Cesium的GroundPrimitive类创建一个实例。GroundPrimitive类可以用于在地面上呈现几何图形，例如线、面等。 3. 加载数据：使用Cesium的GeoJsonDataSource类将GeoJSON数据加载到GroundPrimitive中。 4. 显示数据：将GroundPrimitive添加到Cesium的场景中即可显示数据。 以下是一个示例代码，演示如何加载GeoJSON线数据： ```javascript // 准备数据 var geojsonData = { "type": "FeatureCollection", "features": [ { "type": "Feature", "geometry": { "type": "LineString", "coordinates": [ [-74.0059, 40.7128], [-77.0369, 38.9072] ] }, "properties": { "name": "New York to Washington DC" } } ] }; // 创建GroundPrimitive var groundPrimitive = new Cesium.GroundPrimitive({ geometryInstances: [] }); // 加载数据 var dataSource = Cesium.GeoJsonDataSource.load(geojsonData); dataSource.then(function(dataSource) { var entities = dataSource.entities.values; for (var i = 0; i < entities.length; i++) { var entity = entities[i]; var geometryInstance = new Cesium.GeometryInstance({ geometry: new Cesium.PolylineGeometry({ positions: entity.polyline.positions.getValue(), width: 5.0 }) }); groundPrimitive.geometryInstances.push(geometryInstance); } }); // 添加到场景中 viewer.scene.primitives.add(groundPrimitive); ``` 在该示例代码中，我们首先准备了一个包含一条线的GeoJSON数据。然后创建了一个GroundPrimitive实例，并使用GeoJsonDataSource类将数据加载到其中。最后，将GroundPrimitive添加到场景中即可显示数据。
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值