XTTX110-CSDN博客

原创 Cesium+Vue3 学习教程系列目录

本系列教程基于Cesium+Vue3+Vite+Typescript+elementplus技术栈，系统讲解WebGIS开发。教程循序渐进，适合Cesium开发者学习进阶。

2025-10-11 14:30:32 350

原创 Vue3+Cesium电子围栏效果

本系列采用Cesium+Vue3+Typescript+elementplus技术栈，重点讲解电子围栏效果的实现。文章详细介绍了开发过程，并展示了最终效果图，后续将持续探索Cesium高级功能。

2026-04-14 10:20:52 15

原创 Vue3+Cesium实现淹没效果

本文介绍了一个基于Cesium+Vue3+TypeScript+ElementPlus技术栈的WebGIS学习系列，重点展示了如何实现淹没效果，并预告将持续探索Cesium的高级功能。

2026-04-14 10:14:55 121

原创 Vue3+Cesium实现可调整的迁徙图

本系列采用Cesium+Vue3+Typescript+elementplus技术栈，重点探索Cesium高级功能应用。目前已实现可调整迁徙图功能。

2026-01-28 11:22:43 131

原创 Vue3+Cesium+turf 实现缓冲区分析

本文介绍了一个基于Cesium+Vue3+Typescript+elementplus技术栈的WebGIS学习系列，重点展示了使用Vue3+Cesium+turf实现缓冲区分析的方法。

2026-01-28 11:13:30 306

原创 Vue3+Cesium实现高度雾

本系列教程基于Cesium+Vue3+TypeScript+ElementPlus技术栈，将逐步深入探索Cesium的高级功能。目前已实现高度雾效果。

2026-01-27 09:13:37 266

原创 Vue3+Cesium积雪效果，动态设置颜色厚度

摘要：本系列教程采用Cesium+Vue3+Typescript+ElementPlus技术栈，重点讲解WebGIS开发技术。最新内容展示了Vue3+Cesium实现积雪效果的方法，包括动态设置颜色和厚度等高级功能。

2026-01-27 09:11:29 468

原创 Vue3+Cesium动态设置地图样式

本系列教程基于Cesium+Vue3+Typescript+ElementPlus技术栈，将逐步探索Cesium高级功能。内容包括动态地图样式设置等WebGIS开发技巧。

2026-01-23 11:44:00 205

原创 Vue3+Cesium实现闪电、雷雨效果

本系列采用Cesium+Vue3+Typescript+ElementPlus技术栈，逐步探索Cesium高级功能。目前已完成闪电、雷雨特效的实现

2026-01-23 11:41:30 294

原创 Vue3+Cesium教程(38)--动态雾浓度、颜色

本文介绍了一个基于Cesium+Vue3+TypeScript+ElementPlus技术栈的WebGIS学习系列教程，重点讲解了动态调整雾浓度和颜色的实现方法。教程第38期具体展示了动态雾效的实现效果。

2026-01-22 10:22:57 448

原创 Vue3+Cesium教程(37)--下雪啦！动态设置降雪效果

本文介绍了一个基于Cesium+Vue3+Typescript+elementplus技术栈的WebGIS学习系列，重点讲解了动态降雪效果的实现方法，供读者参考学习动态设置降雪效果的具体实现过程。

2026-01-22 10:19:59 235

原创 Vue3+Cesium教程(36)--动态设置降雨效果

本教程基于Cesium+Vue3+Typescript+elementplus技术栈，详细讲解动态设置降雨效果的实现方法。系列教程将持续探索Cesium高级功能，所有源码免费公开。

2026-01-05 09:16:30 353

原创 Vue3+Cesium教程(35)--云代码封装及动态设置多片云参数

本教程基于Cesium+Vue3+Typescript+elementplus技术栈，免费公开源码，将逐步探索Cesium高级功能。内容包括云代码封装及动态设置多片云参数实现过程

2026-01-05 09:13:20 304

原创 Vue3+Cesium开发教程(34)--动态设置云效果

摘要：本教程基于Vue3+Cesium+TypeScript技术栈，源代码免费。本篇讲解动态设置云效果的方法。

2025-12-15 16:05:20 167

原创 Vue3+Cesium开发教程(33)--无需Token，离线使用Cesium的正确方式

本文介绍基于Cesium+Vue3+Typescript+elementplus技术栈的WebGIS开发教程，提供免费开源代码，本篇介绍无需token也能正常使用Cesium。

2025-12-15 16:02:12 332

原创 Vue3+Cesium开发教程(32)--离线地形获取、切片及地形服务发布方法

本文介绍了使用Cesium加载非官方地形数据的方法，主要包括：1）从地理空间数据云获取30米分辨率DEM数据；2）使用开源工具cesium-terrain-builder将TIF格式地形数据转换为.terrain切片；3）通过nginx发布地形服务，配置gzip压缩支持；4）在Cesium+Vue3系统中集成自定义地形服务。

2025-12-08 10:02:40 532

原创 Vue3+Cesium开发教程(31)——动态调整glb/gltf样式风格

本教程基于Cesium+Vue3+Typescript+elementplus技术栈，免费公开源码，逐步探索Cesium高级功能。重点讲解动态调整glb/gltf模型样式的方法，实现效果详见示例图。关注公众号"webgis学习"，私信"Cesium学习系列源码"获取完整代码。详情可查看原文链接。

2025-11-27 13:24:21 177

原创 Vue3+Cesium开发教程(30)——全局背景图切换

本文介绍基于Cesium+Vue3的技术栈实现地球背景图切换功能，包含纯色背景和自定义图片背景两种模式。相关源码免费公开。

2025-11-20 09:42:28 257

原创 Vue3+Cesium开发教程(29)——设置全局大气环境

本系列教程基于Cesium+Vue3技术栈，详细介绍如何设置全局大气环境变量，包括光照强度、色相、饱和度等参数调节方法。源码免费公开，可通过关注"webgis学习"公众号获取完整代码。本文源自系列第29篇教程，重点讲解大气散射与色彩校正系数的配置技巧。

2025-11-14 09:35:35 283

原创 Vue3+Cesium开发教程(28)---实时调整3dtiles位置、姿态（heading、pitch、roll）

本文介绍基于Cesium+Vue3+Typescript技术栈实现3DTiles模型的实时姿态调整功能，包括heading、pitch、roll参数的动态修改。作为系列教程的第28篇，该系列将持续探索Cesium高级功能开发。

2025-11-14 09:12:51 495

原创 Vue3+Cesium学习教程(27)---实时动态调整三维倾斜模型3dtiles位置

本文介绍了一个基于Cesium+Vue3+TypeScript+ElementPlus技术栈的WebGIS学习系列教程，重点演示了实时动态调整3DTiles倾斜模型位置的功能。教程所有源码免费公开，并将持续更新探索Cesium的高级功能。具体实现效果可参考原文链接中的案例演示。

2025-11-05 09:32:50 325

原创 Vue3+Cesium学习教程(26)---点聚合（Primitive实现）

本文针对Cesium中EntityCluster在处理大数据量时性能下降的问题，提出改用Primitive实现点聚合的方案。通过分析EntityCluster.js的设计思路，作者实现了基于Primitive的聚类器，有效提升了渲染性能。文章包含具体实现效果展示，并提供了Vue3+Cesium教程链接，详细代码可参考原文。这种改进方案能够解决Entity在大数据场景下帧率下降的问题。

2025-11-05 09:21:42 194

原创 Vue3+Cesium学习教程系列（24）——Entity实现点聚合效果

本文介绍了一个基于Cesium+Vue3+Typescript+elementplus技术栈的WebGIS学习系列教程。该系列重点讲解如何利用Entity实现点聚合效果，所有源码免费公开，并将持续更新Cesium高级功能

2025-10-23 13:59:27 183

原创 Vue3+Cesium学习教程系列（23）——Cesium动态标绘和编辑文字、图标（图片）、glb模型

本文介绍了基于Vue3+Cesium+Typescript实现动态标绘和编辑文字、图标及3D模型的方法。通过创建CommonLabel（文字）、CommonBillboard（图标）和CommonModel（模型）三个继承BaseDraw的类，分别实现了各类元素的绘制功能。文章详细展示了每个类的构造参数配置、实体创建方法以及点击事件处理，并说明如何将这些类集成到EditHelper中实现编辑功能

2025-10-23 13:52:04 588

原创 Vue3+Cesium学习教程系列开发进展

文章编写，相关代码已上传至git，全部免费。大家如果有什么功能需求的话，也可以在微信公众号“webgis学习”里给我留言或私信。20251016完成。

2025-10-17 13:36:56 175

原创 Vue3+Cesium学习教程系列（22）---一种更加实用的椭圆绘制与编辑方法

本文介绍了基于Cesium+Vue3技术栈实现三点法绘制椭圆形的方法，通过三个控制点确定椭圆的长短轴和旋转角度，利用Cesium的Entity.ellipse属性实现绘制功能。文章详细展示了核心代码实现步骤，包括计算椭圆参数、处理旋转角度以及实现编辑功能，最终效果可精准控制椭圆形状和方向。

2025-10-17 13:32:27 815

原创 Cesium+Vue3学习教程系列（21）---Cesium与turf.js结合，以椭圆形的绘制与编辑为例

本教程介绍如何使用Cesium+Vue3结合Turf.js实现椭圆绘制与编辑功能。Turf.js是一个轻量级开源GIS引擎，提供丰富的空间分析功能。教程详细展示了如何安装Turf.js、创建椭圆类继承基础多边形类，以及利用Turf.js的distance和ellipse方法计算椭圆坐标点，最后将椭圆添加到编辑工具中。

2025-10-16 17:26:24 767

原创 Cesium开源学习系统进展20251015

【摘要】2025年10月15日完成Cesium+Vue3教程系列第20篇，详细介绍圆形与扇形绘制编辑功能，配套代码已开源至GitHub。本教程完全免费，欢迎GIS开发者学习使用。

2025-10-16 17:17:20 142

原创 Cesium+Vue3学习教程系列（20）---圆形、扇形绘制与编辑

本教程基于Cesium+Vue3技术栈，新增圆形和扇形标绘功能。圆形通过Cesium的EllipseGraphics实现，使用两点确定圆心和半径；扇形则通过Polygon模拟，三点确定圆心、半径和角度，并借助ENU坐标系转换计算圆弧点坐标。代码封装了CommonCircle和CommonSector类，支持绘制和编辑功能。

2025-10-16 17:10:01 695

原创 Cesium开源学习系统开发进展20251014

文章编写，相关代码已上传至git，大家如果有什么功能需求的话，也可以在微信公众号“webgis学习”里给我留言或私信。20251014完成。

2025-10-14 13:34:43 158

原创 Cesium+Vue3学习教程系列（19）---多边形标绘代码封装修改，新增矩形绘制

本文介绍基于Cesium+Vue3技术栈的GIS开发系列更新，重点讲解了多边形标绘功能的代码重构与矩形绘制实现。主要内容包括：1）将原有BaseArrow类重构为BasePolygon基类，支持多种多边形绘制；2）新增CommonRectangle矩形类继承BasePolygon；3）实现矩形坐标计算算法CreateRectanglePoints；4）展示前端调用方式和实现效果。文章预告后续将更新圆形、扇形等标绘功能，相关代码已开源在Git的master分支。

2025-10-14 13:24:39 427

原创 Cesium+Vue3学习系列（18）---离线 XYZ 瓦片：内网环境大文件流畅加载方案

本文介绍了使用XYZ标准瓦片方案解决Cesium加载大影像卡顿问题的方法。通过QGIS生成XYZ瓦片，处理黑边无效数据后部署到本地目录，配合Cesium的UrlTemplateImageryProvider实现离线加载。该方案适用于内网环境，满足保密需求。文章详细说明了从瓦片生成到前端集成的完整流程，并提供了测试数据和代码示例。

2025-10-13 13:56:47 786

原创 Cesium+Vue3学习系列（17）---加载WMTS服务，解决大文件卡顿问题

本文介绍了如何通过Cesium+Vue3技术栈优化大体积TIFF影像加载性能。针对WMS服务加载大文件时卡顿的问题，提出将影像发布为WMTS瓦片服务的解决方案，实现按需分块加载。详细讲解了Geoserver中创建WMTS服务的9个步骤，包括工作区设置、数据存储发布、切片策略选择等。同时提供了Cesium加载WMTS服务的代码示例，展示了通过瓦片化处理后影像加载的流畅效果。后续将持续更新。

2025-10-13 13:51:28 771

原创 Cesium开源学习系统开发进展20251011

里初步封装了图层管理功能，在其基础上扩展如何实现在Cesium中加载Geoserver发布的矢量（shp、shapefile）WMS数据服务。相关文章已发布到CSDN，代码托管到git，欢迎查阅。后面大家如果有什么功能需求的话，也可以在微信公众号“webgis学习”里给我留言或私信。20251011之前在。

2025-10-11 14:20:27 184

原创 Cesium+Vue3学习系列（16）---Cesium加载Geoserver发布的矢量（.shp）WMS数据服务

本文介绍了如何在Cesium+Vue3项目中加载Geoserver发布的WMS矢量数据服务。详细讲解了从创建工作区、发布Shapefile数据到自定义样式的完整流程，包括SLD样式文件配置和前端代码实现。文章提供了测试数据和样式文件，重点说明了Geoserver中数据发布的关键步骤和注意事项，如坐标系设置、字符集选择等，最后展示了如何在Cesium中动态加载和移除WMS图层。

2025-10-11 14:13:10 1280