Cesium 实战 10 - 两种方式加载 Geoserver 服务 WMTS 以及 WMS、WFS、KML 资源图层

已于 2024-05-06 10:58:33 修改
阅读量8.1k 收藏 40
点赞数 11
分类专栏： Cesium 实战教程 文章标签： geoserver wmts cesium wmts cesium wms geoserver缓存 cesium叠加wfs
于 2022-10-23 21:11:25 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/linzi19900517/article/details/127479572
版权
Cesium 实战教程 专栏收录该内容
53 篇文章 127 订阅 ¥29.90 ¥99.00
订阅专栏
本文介绍了如何在Cesium中加载Geoserver发布的WMTS缓存图层、WMS图层、WFS图层以及KML数据。重点强调了加载WMTS图层时style参数的重要性以及正确设置地址的必要性。提供了两种加载WMTS图层的方式，并给出了核心代码示例和在线示例链接。
摘要由CSDN通过智能技术生成

Cesium 实战 - 两种方式加载 Geoserver 服务 WMTS 以及 WMS、WFS、KML 资源图层

2023年4月19日更新—搞了一个 Cesium 镜像，欢迎使用：沙盒示例 和 API

最近有需求，Cesium 叠加 Geoserver 缓存瓦片，也就是 WMTS 瓦片，本来想直接使用 Tomcat 之类的容器发布瓦片服务再叠加。

后来发现 Geoserver 的瓦片规则有点不太常规，因此还是使用 Geoserver 的服务来叠加缓存图层。

按老规矩，肯定要试一大堆错的，大概试了小半天，终于搞好了，这里放上成功代码，提供广大 GISer 借鉴参考。

PS：百度搜索的一大堆博客大哥，估计试都没试，直接互相复制的，出现问题几乎都差不多！！！

本示例介绍两种叠加方式，Geoserver Rest 方式和标准 WMTS 方式，推荐使用 标准 WMT

了解本专栏 订阅专栏 解锁全文
非科班Java出身GISer
关注
专栏目录
订阅专栏
Cesium 实战 - 加载 Geoserver WMS 图层以及条件查询和切换图层样式
linzi19900517的博客
12-18 1520
Cesium 加载 Geoserver WMS 图层以及条件查询和切换图层样式。
Cesium之加载GeoServer或geowebcache的WMTS服务
shanshanqwertyuiop的博客
04-23 878
Cesium加载GeoServer地理坐标WMTS服务。
（十二）Cesium加载Geoserver的WMS、WFS服务，点击查询属性
a974313302的博客
05-14 1299
目前基于需求，加载InSar滑坡数据，点击显示信息。
cesium中加载geoserver中的json数据，并设置多边形贴地
最新发布
警警的博客
08-08 473
由于直接处理地形高度可能比较复杂，另一种更简单但可能不那么精确的方法是使用 Cesium 的默认地形贴地效果（如果有的话），这通常适用于简单的应用场景。对于需要精确贴地的复杂场景，你可能需要深入研究 Cesium 的地形处理功能或考虑使用其他库（如 Three.js）来实现更高级的地形和几何处理。你可能需要遍历多边形的每个顶点，将其从经纬度转换为地形上的高度，然后再转换回 Cartesian3 坐标。这通常意味着你需要为多边形中的每个顶点指定一个高度值，这个高度值可以是地形表面的高度。
Cesium加载各种来源的wms和wmts服务
u014015203的博客
05-10 2917
使用WebMapTileServiceImageryProvider加载，加载方法如下，除了实现方法，针对不同平台发布的wmts服务的配置地址也很重要。使用WebMapServiceImageryProvider加载，加载方法如下，除了实现方法，针对不同平台发布的wms服务的配置地址也很重要。选中所需图层，点击进入下面页面。基础地址 + 各个参数。
Cesium加载geoserver WMS要素服务，发现切片lable重复
weixin_39216318的博客
08-17 527
geoserver label出现多个重复标签
Cesium笔记 加载GeoServer服务，以及跨域问题
qq_40216244的博客
10-13 4124
一、加载如下的GeoServer发布地图服务 加载代码如下，其中url为红线框选部分，layers为发布的图层NAME //加载GeoServer图层，测试数据 ShowTestData() { var layer = new Cesium.WebMapServiceImageryProvider({ url: 'url', layers: 'pipelin...
Cesium中加载geoserver发布的二维地图服务
On the way
06-26 435
注意：若加载时出现跨域问题可进行配置Geoserver的。4.发布成功后使用cesium进行加载显示：代码如下图。2.进行初始化配置，进行加载显示cesium.3.使用geoserver进行地图服务发布.1.第一步，先引入cesium。
cesium加载geoserver的wmts服务
m0_65745337的博客
08-06 609
1、加载坐标系为4326的服务。
Cesium加载Geoserver发布的wmts服务
Dani05的博客
04-18 1641
在Geoserver欢迎界面点击右侧WMTS服务，打开xml文件，找到要发布的图层，复制url（Geoserver版本不同url结构略有差异）。 修改url，将{TileMatrix}改为{TileMatrixSet}:{TileMatrix}。图层预览时可以看到发送的Request URL中TileMatrix参数值为EPSG:900913:11，是TileMatrixSet:TileMatrix的形式。 代码如下，如果选择EPSG:4326，还需要添加tilingScheme: n...
Cesium加载Geoserver跨域问题
10-15
https://blog.csdn.net/qq_40216244/article/details/109046931 ceslium加载Geoserver跨域问题方法步骤，真实有效。
cesium加载geoserver的wmts服务.zip
06-19
标题"cesium加载geoserver的wmts服务.zip"暗示了这个压缩包包含的资源和教程，主要是关于如何在Cesium中集成和使用GeoServer提供的WMTS服务。以下是关于这个主题的详细知识点： 1. **Cesium简介**：Cesium是一个...
Cesium 实战 - 加载 Geoserver 图层以及范围过滤
linzi19900517的博客
12-18 1241
Cesium 加载 Geoserver 图层以及范围过滤。
cesium-加载geoserver发布的WMTS服务
孙霸天的专栏
03-09 1148
cesium-加载geoserver发布的WMTS服务 发布数据 默认安装好geoServer 选择数据存储 选择添加新的数据存储 选择GeoTIFF 选择数据 发布数据 发布成功 实际效果 完整代码 在首页选择WMTS 查看WMTS的配置信息 这里地图使用的是mapbox地图 叠加上geoServer的WMTS <!-- home --> <template> <div class="home"> <el-breadcrumb s
Cesium加载GeoServer发布WMTS系列问题
Tonque的博客
10-30 1000
使用cesium加载用geoserver发布的wmts服务过程中遇到的系列问题
Cesium:加载GeoServer-WMS服务
席木木的博客
06-14 1703
WMS服务，网络地图服务，不同于WMTS服务，是一种没有本地瓦片缓存的单张影像图片，被发布到GeoServer服务器上之后，可以通过网络进行访问（发布过程参见：《Openlayers与GeoServer：跨域配置与WMS服务加载》）。...
cesium加载wmts服务
m0_48524977的博客
08-25 2179
cesium加载wmts服务。
学习路之Cesium--加载geoserver离线地图
Green
06-11 561
【代码】学习路之Cesium--加载geoserver离线地图。
cesium 矢量图 编辑_cesium结合geoserver利用WFS服务实现图层编辑(附源码下载)
06-07
好的，我明白了。关于您的问题，我可以回答：Cesium是一个基于WebGL的虚拟地球和地理信息系统（GIS）库，可以用来展示地球上的各种数据，包括矢量图、卫星影像、地形模型等等。而Geoserver是一个开源的地理信息系统服务器，可以提供各种地图服务，包括WFS服务。 通过将Cesium和Geoserver结合起来，我们可以实现矢量图的编辑，具体步骤如下： 1. 首先，需要在Geoserver上创建一个WFS数据源，并发布一个WFS服务。这里不再赘述具体的步骤，可以参考Geoserver的官方文档。 2. 在Cesium中，可以使用Cesium的DataSource来加载WFS服务中的图层数据。具体步骤如下： ```js // 创建一个DataSource var dataSource = new Cesium.GeoJsonDataSource(); // 加载WFS服务中的数据 var promise = dataSource.load('http://localhost:8080/geoserver/wfs', { service: 'WFS', version: '2.0.0', request: 'GetFeature', typeName: 'myworkspace:mylayer', outputFormat: 'application/json' }); // 数据加载完成后，将数据源添加到场景中 promise.then(function() { viewer.dataSources.add(dataSource); }); ``` 3. 接下来，可以使用Cesium的Entity来表示每个要素，并添加一些编辑功能。例如，可以使用Cesium的PolylineGraphics来表示线要素，并添加编辑功能。 ```js // 创建一个线要素 var entity = dataSource.entities.add({ polyline: { positions: Cesium.Cartesian3.fromDegreesArray([ -110.0, 38.0, -105.0, 40.0 ]), width: 5, material: Cesium.Color.RED } }); // 添加编辑功能 entity.polyline.editable = true; entity.polyline.width = 10; entity.polyline.material = Cesium.Color.BLUE; ``` 4. 最后，可以监听Cesium的编辑事件，将编辑结果保存回Geoserver中。 ```js // 监听编辑事件 dataSource.entities.collectionChanged.addEventListener(function(collection, added, removed, changed) { // 将编辑结果保存回Geoserver中 // ... }); ``` 以上是实现矢量图编辑的大致步骤，具体的实现可能会因为数据源的不同而有所差异。希望对您有所帮助。
评论 9
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

非科班Java出身GISer

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值