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

Cesium加载离线地图和离线地形 直接把地图数据切片,然后通过nginx以静态服务方式发布。图新地球提取码oznv————————————用来下载地图红豆地球提取码2thg————————————用来下载地图Nginx提取码wnjl——————————————代理服务器,用于瓦片数据发布Cesiumlab提取码iey3————————————用于数据切片MapBox影像提取码48dt———————————用来加载影像Test源码提取码1cpt——————————————Test目录下所有文件桂林市七星区地形数据。... 阅读详情

本学习系列以Cesium+Vue3+Typescript+elementplus作为主要技术栈。

Cesium官网提供全球的地形数据,但是限于国内网络原因,有的时候无法正常使用官网提供的地形等数据。有的测绘单位自身具备测量地形的资质设备和能力,能够获取比较高精度的地形数据。那如何能够使用Cesium加载非官方的地形数据呢?本篇文章将为您揭晓答案。

本篇文章主要用到以下几个工具,都是免费、或者开源协议比较友好的工具。

  • 使用地理空间数据云获取tif地形;

  • 使用cesium-terrain-builder(以下称CTB软件)软件将tif地形处理为.terrain切片;

  • nginx发布地形服务;

具体步骤如下:

1、登录地理空间数据云,选择30米分辨率的数字高程模型数据。这里以最近比较火的张家界七星山荒野求生节目所在地的地形作为目标区域。选好位置后,点击“检索”按钮。然后下载地形数据(注意:地理空间数据云都里的地形数据范围都是按1经度1纬度进行分隔的,可以根据自身需要使用GIS软件进行镶嵌和裁剪)。

2、使用CTB软件进行数据处理,其使用方法如下。为方便演示,本篇仅生成1-12级的地形切片。

Usage: ctb-tile [options] GDAL_DATASOURCE

Options:

  -V, --version                 output program version
  -h, --help                    output help information
  -o, --output-dir <dir>        specify the output directory for the tiles (defaults to working directory)
  -f, --output-format <format>  specify the output format for the tiles. This is either `Terrain` (the default) or any format listed by `gdalinfo --formats`
  -p, --profile <profile>       specify the TMS profile for the tiles. This is either `geodetic` (the default) or `mercator`
  -c, --thread-count <count>    specify the number of threads to use for tile generation. On multicore machines this defaults to the number of CPUs
  -t, --tile-size <size>        specify the size of the tiles in pixels. This defaults to 65 for terrain tiles and 256 for other GDAL formats
  -s, --start-zoom <zoom>       specify the zoom level to start at. This should be greater than the end zoom level
  -e, --end-zoom <zoom>         specify the zoom level to end at. This should be less than the start zoom level and >= 0
  -r, --resampling-method <algorithm> specify the raster resampling algorithm.  One of: nearest; bilinear; cubic; cubicspline; lanczos; average; mode; max; min; med; q1; q3. Defaults to average.
  -n, --creation-option <option> specify a GDAL creation option for the output dataset in the form NAME=VALUE. Can be specified multiple times. Not valid for Terrain tiles.
  -z, --error-threshold <threshold> specify the error threshold in pixel units for transformation approximation. Larger values should mean faster transforms. Defaults to 0.125
  -m, --warp-memory <bytes>     The memory limit in bytes used for warp operations. Higher settings should be faster. Defaults to a conservative GDAL internal setting.
  -R, --resume                  Do not overwrite existing files
  -q, --quiet                   only output errors
  -v, --verbose                 be more noisy

3、使用nginx将生成的地形数据发布为服务。由于CTB软件生成的地形都是使用gzip压缩过的,因此地形服务需要添加gzip头才会被浏览器识别。关键配置如下:


    # .terrain 文件,支持 Cesium 的 quantized-mesh 扩展
    location ~* \.terrain$ {
        # 告诉浏览器这是二进制流
        add_header Content-Type            "application/octet-stream" always;
        add_header Content-Encoding        "gzip" always;
        # 可选:让浏览器直接下载(调试用)
        # add_header Content-Disposition   'attachment; filename="$uri"';
        try_files $uri =404;
    }

4、将地形服务加载Cesium系统中,这里使用之前Cesium+Vue3学习系列(4)---图层管理功能封装做好的地形加载功能。


case 'terrain':
    this.viewer.terrainProvider = await Cesium.CesiumTerrainProvider.fromUrl(
        item.url!
    );
    handle = { __terrain: true }; // 占位,方便 remove 时切回 ellipsoid
    break

5、效果如下

6、如果觉得本系列教程文章及代码对您有用的话,欢迎关注威信公众号“webgis学习”,详情请点击查阅原文Vue3+Cesium开发教程(32)--离线地形获取、切片及地形服务发布方法

Cesium+OpenLayers+PostGIS智慧公交站点三维可视化与空间分析实践 WebGIS开发中,空间数据的管理、分析与可视化是核心能力。PostGIS作为PostgreSQL的空间扩展,将数据库升级为真正的空间数据库,支持缓冲区、覆盖范围等复杂空间分析,是处理海量空间数据的高效底座。Cesium作为三维地球引擎,擅长城市级场景渲染与动态特效,广泛应用于三维可视化大屏。OpenLayers则提供轻量化的地图交互编辑能力,可用于空间数据采编。三者结合,能够打通“数据采集-存储分析-三维展示”的完整链路。智慧城市和智慧交通场景下,常需评估公交站点覆盖率、识别盲区,并将成果呈现在三维大屏上 阅读详情

相关推荐

Cesium初始化从零到可用:依赖、Token、资源路径与性能配置指南

三维GIS可视化已成为Web前端工程化实践中的重要方向,Cesium作为基于WebGL的开源三维地球引擎,能够在浏览器中高效渲染真实地理场景。然而,从创建Viewer到真正投入业务使用,中间还隔着Token认证、静态资源加载、影像底图、地形配置、坐标系约定等一系列关键环节,任何一个细节都可能阻塞项目推进。无论是园区安防大屏、数字孪生平台还是智慧城市可视化,都依赖一个稳定可靠的初始化底座。本文从工程实践视角出发,梳理Cesium依赖引入方式、Viewer参数逐项拆解、离线部署资源路径处理、图层地形与坐标系底层

weixin_30219613的博客 199

通过Cesium制作地形的离线加载

然后下载地形的高程图tif文件,和卫星的影像图tif文件。在地理空间世界云的高程图比较可靠,这里选GDEMV2,GDEMV3都可以。本片用的2,对应的经纬度选择下载,下载的文件中就有tif。打开Nigix,并设置好配置文件的路径,端口等。投影参数根据,下载卫星影像图的坐标系对应选择。首先要启用Cesium的插件,装配好如图中的几个组件。下好的数据,要在cesiumlab3里进行切片,才能在Cesium里使用。将Json文件输入到,url的路径中,设置好地形。将Xml文件输入到,url的路径中,设置好影像。

m0_64217692的博客 2390

OpenLayers 测距踩坑实录:从 EPSG:4326 坐标偏差到 Vue 中内存泄漏的排查与修复

本文深入探讨了OpenLayers测距功能的实现与优化,从EPSG:3857与4326坐标系的精度差异到Vue组件中的内存泄漏排查与修复。通过详细的代码示例和性能对比,帮助开发者解决常见问题,提升WebGIS应用的稳定性和用户体验。

weixin_30650039的博客 348

学习 Cesium (五):加载离线高程数据

目录学习 Cesium (五):加载离线高程数据前言获取高程数据高程数据处理安装 Python 2.7注册 Python 2.7安装 PIL安装 GDAL安装 numpy安装 GDAL py2.7版生成 .terrain 数据集成到Cesium 学习 Cesium (五):加载离线高程数据 前言 通过前面的学习,Cesium 最基本的应用已经可以了。但是,在实际项目中我们还需要加入高程数据,才能显示真实的地形。下面我就一步一步介绍如何加载真实的高程数据。 获取高程数据 高程数据从哪里来呢?现在市面上有些卫星

LeoOthello的专栏 9134

18.(cesium之家)cesium接入加载地形服务(离线)

18.(cesium之家)cesium接入加载地形服务(离线)

地图之家 676

cesium vue2/vue3教程目录导航

以下是本专栏目录导航,送完整项目源码(拒绝单页源码),可以直接运行,全部配置免费视频教程(B站)。

qq_29384639的博客 4317

Cesium+Vue3 学习教程 系列目录

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

XTTX110的博客 415

地图之家总目录

地图之家总目录 cesium示例 leaflet示例

GIS之家家长 1万+

Cesium开发工具篇 | 01组件重写

在刚开始的入门篇中,我们讲过 Cesium 小组件的显隐,感兴趣的小伙伴可以查看我前面写过的文章 Cesium初始化界面介绍及相关小组件显隐 。那问题来了,这些组件除了能控制显隐,是否能在不修改源码的基础上对其进行扩展重写呢?答案是当然可以!但并不是所有的组件都能重写,本节主要讲解在不修改源码的基础上,如何对以下三个常用的控件进行修改,以达到快速实现实际中业务需求的功能。当然,如果您对 Cesium 源码研究得比较深入,也可以通过修改源码的方式实现。homeButton组件homeButton 功能在实际的

暮紫月升 7555

实战级红蓝对抗可视化系统架构与落地实践

红蓝对抗可视化是军事仿真、应急推演与关键基础设施管控中的核心能力,其本质是将多源异构时空数据转化为可决策的态势认知。系统需基于统一时空基准实现陆海空多域数据融合,依托前后端分离架构解耦推演逻辑与渲染逻辑,并通过高精度数据回放支撑战术复盘。关键技术包括CesiumJS深度定制、PostgreSQL+TimescaleDB时序存储、WebSocket状态同步协议及GCJ-02安全脱敏。本文聚焦真实部署场景下的架构设计、性能优化与避坑指南,覆盖训练管理、实时渲染、秒级回放与Docker化运维全链路,为电力调度、交

weixin_30591551的博客 488

深度学习|卷积神经网络

介绍卷积神经网络基本理论,包括卷积层、池化层和全连接层,并阐述LeNet卷积神经网络的构建过程。

weixin_58243219的博客 5727

Vue 集成 Cesium 全流程避坑:环境搭建、组件封装与性能调优

三维地理引擎 Cesium 基于 WebGL 实现球体渲染与地理坐标系原生化,在 Vue 项目中集成时,命令式渲染与响应式代理常引发空白地球、性能下降。通过 shallowRef 隔离 Viewer 实例,配合 CESIUM_BASE_URL 正确部署静态资源,并利用 requestRenderMode 按需渲染,可显著降低资源开销。该方案适用于点位标注、glTF 模型加载、相机飞行与点击拾取等场景,为 Vue 开发者提供从环境搭建、组件封装到打包调优的完整实践路径。

weixin_34353714的博客 386

Mid-360与FAST-LIO2实战:从点云采集到高精度建图全流程解析

本文详细解析了使用Livox Mid-360激光雷达与FAST-LIO2算法实现高精度实时建图的全流程。内容涵盖硬件准备、软件环境搭建、算法部署配置、数据采集实战,并重点探讨了多楼层场景下的参数调优与误差抑制策略,为机器人及无人机三维感知应用提供了实用指南。

prometheus9mon的博客 414

Cesium+WebGPU降雨汇流模拟:从地形高程到动态水量场的实时计算

三维GIS可视化中,地形分析与GPU并行计算是构建数字孪生、洪涝推演等应用的基础能力。传统降雨模拟仅停留在视觉层,而真正的汇流模拟需要回答雨水落地后向何处流动、何处积水等物理问题,这要求同时处理地形高程、动态水量场以及持续更新的计算机制。WebGPU的Compute Shader专为大规模数据并行而生,适合承担水量场逐帧演算任务;Cesium则负责三维场景、地形与交互。通过采样地形高程、编写WGSL着色器、双缓冲更新水量并叠加回场景,即可实现实时汇流模拟。该方案可自然延伸至淹没分析、污染扩散等场景,为三维空

weixin_34302798的博客 325

嵌入式开发避坑指南:用DWT做延时函数,这几个细节不注意代码会跑飞

本文深入探讨了在Cortex-M嵌入式开发中使用DWT实现精确延时函数的关键技巧与常见陷阱。针对DWT_CYCCNT计数器应用中的内核兼容性、溢出处理、编译器优化等五大核心问题,提供了工业级稳健解决方案,帮助开发者避免代码跑飞风险,实现微秒级高精度延时控制。

weixin_42653691的博客 160

48、住宅抵押贷款支持证券的定价、风险评估与结构化设计

本文深入探讨了住宅抵押贷款支持证券(RMBS)的定价、风险评估与结构化设计。内容涵盖提高定价准确性的方差缩减方法,如准蒙特卡罗序列的应用;分析RMBS面临的利率风险、信用风险和模型风险,并提出相应的度量与应对策略;介绍利用动态规划优化CMO分层结构以最大化发行利润的方法。同时总结了RMBS的基本类型、定价流程及市场发展趋势,为投资者和发行人提供全面的决策支持。

quiet的专栏 154

手把手教你用Bigemap搭建离线地图服务器(含开发配置全流程)

本文详细介绍了如何利用Bigemap搭建企业级离线地图服务器,涵盖从环境准备、数据工程到高可用部署的全流程。针对金融、能源等敏感行业,提供私有化部署方案解决网络依赖和数据安全问题,并分享硬件配置、智能区域规划等实战技巧,助力企业快速构建稳定高效的离线地图服务。

weixin_30897233的博客 466

【MATLAB代码】二维平面的TOA定位,GDOP(几何精度因子)和CRLB(克拉美罗下界)计算与输出

本文介绍了一个MATLAB程序,用于计算二维定位场景中的几何精度因子(GDOP)和克拉美罗下界(CRLB)。该程序针对单目标和四个锚点配置,通过网格扫描法计算空间各点的GDOP分布,并以等高线图可视化展示。程序还可计算特定位置的理论定位精度下限(CRLB),输出X/Y方向标准差和GDOP值。核心算法通过构建几何矩阵和费舍尔信息矩阵实现,考虑了测量误差影响,并处理了特殊位置情况。程序提供了完整的源代码和参数修改说明,适用于定位系统精度分析。

985工科博士毕业,专攻定位、导航和滤波等算法研究。从业10年,主要使用MATLAB 803

Cesium从入门到实战:环境搭建、3D Tiles与倾斜摄影核心指南

三维GIS可视化是构建智慧城市与数字孪生应用的关键技术,Cesium作为基于WebGL的开源JavaScript库,天然支持全球尺度三维场景渲染,并内置WGS84坐标系、瓦片金字塔与LOD调度机制,大幅降低了Web端三维地理空间开发的复杂度。从最基础的环境搭建和坐标转换,到影像底图接入、地形高程处理、3D Tiles数据加载,再到倾斜摄影单体化与模型交互,每一步都直接关系到项目的稳定性和用户体验。与此同时,合理运用Entity与Primitive的区别,掌握动态光照、雷达波效果和性能优化手段,能让三维场景在

weixin_33868027的博客 316

【WRF-Urban】WUDAPT详解:An Urban Weather, Climate, and Environmental Modeling Infrastructure

WUDAPT详解:An Urban Weather, Climate, and Environmental Modeling Infrastructure

WW、forever的博客 497

clock min pulse width检查

高电平脉宽 = clock fall edge到达FF/CK的时间 - clock rise edge到达FF/CK的时间;低电平脉宽 = 下一T clock rise edge到达FF/CK的时间 - clock fall edge到达FF/CK的时间。而required pulse width是根据FF/CK处的transition,根据查找表计算得到的。为什么clock transition越大,会导致required pulse width越大呢?5、 降低clock上的串扰。

芯冰乐 577

智慧公交站点系统:Cesium+OpenLayers+PostGIS 三维可视化落地实践

空间数据管理和三维可视化是智慧城市与交通信息化建设中的常见需求,但项目落地远不止渲染一张大屏。面对公交站点新增、迁移、废弃等高频变化,以及站点500米覆盖范围、盲区识别等空间分析诉求,必须建立以空间数据库为核心的数据采编与展示链路。PostGIS作为PostgreSQL的空间扩展,提供几何存储、GIST索引及缓冲区计算能力,是覆盖分析和盲区查询的可靠底座;OpenLayers以成熟的二维绘制交互承担站点日常采编;Cesium则在三维大屏中呈现站点分布与覆盖态势。三者围绕同一份GeoJSON数据流协同工作,能

cqwmy840702的博客 442

Keil uVision5 STM32 startup_stm32f10x_md_vl.s error A3906U Malformed via file target not created..

🏆 本文收录于《全栈Bug调优(实战版)》专栏,致力于分享我在项目实战过程中遇到的各类Bug及其原因,并提供切实有效的解决方案。无论你是初学者还是经验丰富的开发者,本文将为你指引出一条更高效的Bug修复之路,助你早日登顶,迈向财富自由的梦想🚀!同时,欢迎大家关注、收藏、订阅本专栏,更多精彩内容正在持续更新中。让我们一起进步,Up!Up!Up!    备注: 部分问题/难题源自互联网,经过精心筛选和整理,结合数位十多年大厂实战经验资深大佬经验总结所得,数条可行方案供所需之人参考。

**My Coding Family** 2776

Tangram Engine:Rust+WASM重构的3D GIS引擎,支持真实大气与体积云

地理空间三维可视化正从‘渲染驱动’转向‘物理真实驱动’。传统WebGL引擎依赖JavaScript协调GPU与CPU,导致3D Tiles加载卡顿、大气模拟失真、坐标系转换脆弱。Tangram Engine以Rust编译至WASM为核心,将WGS84投影计算、LOD调度、体积云光线步进等关键路径全量下沉至SIMD加速的WASM线程,实现首帧842ms极速加载与FPS稳定58的实时地理空间仿真。其‘GeoEntity’抽象统一处理点云、BIM、NetCDF雷达等多源数据,使城市数字孪生系统真正具备离线运行、高

diaoju3333的博客 265

Statistics and Machine Learning Toolbox

Statistics and Machine Learning Toolbox(带书签),MATLAB统计学习工具

廖雪峰Python教程[完整版]

廖雪峰的python教程整理的,已经排好版了,而且还是完整的,适合小白

上一篇: Vue3+Cesium开发教程(31)——动态调整glb/gltf样式风格
下一篇: Vue3+Cesium开发教程(33)--无需Token,离线使用Cesium的正确方式
XTTX110
博客等级 码龄15年 35粉丝 71原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明:

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

余额充值