Cesium入门(五):加载WMTS瓦片地图服务

2023-05-16

本章介绍Cesium JS库的WebMapTileServiceImageryProvider类,并以GeoServer为例演示了在CesiumViewer控件中添加瓦片图层的方法。

主要包括以下内容:

  • WebMapTileServiceImageryProvider
  • 添加WMTS瓦片图层

1. WebMapTileServiceImageryProvider

WebMapTileServiceImageryProvider是Cesium JS库中专门用来加载WMTS 1.0.0兼容服务的一个图层类,可以提供键值对和RESTful两种访问方式。主要的构造选项参数如下:

Name

Type

Description

url

String

WMTS GetTile操作的URL

format

String

从服务器上获取的图像的MIME类别

layer

String

WMTS请求的图层名称

style

String

WMTS请求的样式名称

tileMatrixSetID

String

WMTS请求的瓦片集识别符

tileMatrixLabels

Array

WMTS请求中的瓦片矩阵标签列表,一个标签对应一个缩放等级

tileWidth

Number

瓦片的宽度,默认256

tileHeight

Number

瓦片的高度,默认256

tilingScheme

TilingScheme 

切片方案,对应切片矩阵中的切片组织方式

rectangle

Rectangle 

层覆盖的矩形范围

minimumLevel

Number

图层支持的最小级别

maximumLevel

Number

图层支持的最大级别

使用GetTile获取WMTS服务的时候,url中需要填充几个必需的参数:

{layer}:瓦片图层名称

{style}:瓦片风格

{format}:图像类别

{TileMatrixSetID}:瓦片矩阵集合名称,通常为“EPSG:4326”或“EPSG:3857”等

{TileMatrixLabels}:为瓦片矩阵名称,一般为瓦片层级的名称

{TileRow}:为瓦片行编号

{TileCol}:为瓦片行编号

如果使用键值对方式访问的话,上述参数自动组成键值对后与GetTile一起发送至WMTS服务器。如是使用RESTful方式访问的话,上太述这些参数需要出现在瓦片访问url模板中,形如

wmts/rest/{layer}/{style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}?format=image/png

了解了WebMapTileServiceImageryProvider类的构造参数后,就可以根据WMTS服务器的要求构造一个瓦片ImageryProvider,加入到图层容器中就可以看到WMTS瓦片请求的效果了。

如果还没有设置好瓦片图层,可以参考GeoServer入门(二):WMTS图层瓦片切割与调用来设置自己的瓦片服务器。

2. 添加WMTS瓦片图层

(1)使用键值对参数方式访问WMTS瓦片

键值对访问方式是最为简单的一种访问方式,以GeoServer为例,使用键值对访问时只需要按照服务器的要求填充相应的参数即可。

  从源码中看到,默认情况下除了设置url=http://localhost:8080/geoserver/gwc/service/wmts外,还需设置layer、style、tileMatrixSetID和format共4个参数。此处的源码有一个特殊的内部参数tilematrix,也就是瓦片矩阵的名字。

 

  这个内部参数在定义了tileMatrixLabels参数的情况下等于tileMatrixLabels参数的值,也就是自定义的瓦片矩阵的名字;在没有设置tileMatrixLabels参数的情况下等于缩放级别的数字值。

之所以要在这里提出这个tileMatrixLabels参数,是因为GeoServer在缓冲切分瓦片时对每一个缩放级别的存储目录没有使用相应的数字,而使用了网格+级别的方式来命名,如“EPSG:9100913:10”表示的是使用“EPSG:9100913”网格切分的第10级瓦片。

因此,如果想要使用键值对方式访问GeoServer发布的瓦片图层,除了url之个还需要设置至少5个访问参数,主要代码如下:

    <script>
      let wmtsImageryProvider = new Cesium.WebMapTileServiceImageryProvider({
        url : 'http://localhost:8080/geoserver/gwc/service/wmts',
        layer : 'pucheng:satellite',
        style : 'raster',
        format : 'image/png',
        tileMatrixSetID : 'EPSG:900913',
        tileMatrixLabels : ['EPSG:900913:0', 'EPSG:900913:1', 'EPSG:900913:2', 'EPSG:900913:3', 'EPSG:900913:4', 'EPSG:900913:5', 'EPSG:900913:6', 'EPSG:900913:7', 'EPSG:900913:8', 'EPSG:900913:9', 'EPSG:900913:10', 'EPSG:900913:11', 'EPSG:900913:12', 'EPSG:900913:13', 'EPSG:900913:14', 'EPSG:900913:15', 'EPSG:900913:16', 'EPSG:900913:17', 'EPSG:900913:18']
      });

    viewer.imageryLayers.addImageryProvider(wmtsImageryProvider);

    viewer.camera.flyTo({
        destination : Cesium.Cartesian3.fromDegrees(109.637, 34.966, 100000),
        oridntation : {
            heading : Cesium.Math.toRadians(0.0),
            putch : Cesium.Math.toRadians(-25.0),
            roll : 0.0
        }
    });
    </script>

通过“Web开发者工具”可以查看到确实请求到了WMTS瓦片图像。

(2)使用RESTful方式访问WMTS瓦片

RESTful访问方式的访问其实是使用参数模板将一些参数替换到了URL里。根据GeoServer入门(二):WMTS图层瓦片切割与调用中提出的查GeoServer服务能力的方法,可以将url设置为以下形式:

url='/map/gwc/service/wmts/rest/pucheng:satellite/{style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}?format=image/png'

通过查询函数源码可知,在瓦片提供者类构造之时会用style和tileMatrixSetID替换url模板中的占位符:

 

 在请求瓦片图像的requestImage函数中会用tileMatrix、tileRow和tileCol三个参数替换模板中的占位符。

 

 与键值对访问方式一样,RESTful方式还需要设置tileMatrixLabels的值,以使得在GeoServer服务器中能够找到正确的瓦片缓冲。

因此,如果想要使用RESTful方式访问GeoServer发布的瓦片图层,除了url之个还需要设置style、tileMatrixSetID、tileMatrixLabels至少3个访问参数。少了layer和format两个参数的原因是这两个参数已经在url中指定过了。主要代码如下:

    <script>
      let wmtsImageryProvider = new Cesium.WebMapTileServiceImageryProvider({
        url : 'http://localhost:8080/geoserver/gwc/service/wmts/rest/pucheng:satellite/{style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}?format=image/png',
        style : 'raster',
        tileMatrixSetID : 'EPSG:900913',
        tileMatrixLabels : ['EPSG:900913:0', 'EPSG:900913:1', 'EPSG:900913:2', 'EPSG:900913:3', 'EPSG:900913:4', 'EPSG:900913:5', 'EPSG:900913:6', 'EPSG:900913:7', 'EPSG:900913:8', 'EPSG:900913:9', 'EPSG:900913:10', 'EPSG:900913:11', 'EPSG:900913:12', 'EPSG:900913:13', 'EPSG:900913:14', 'EPSG:900913:15', 'EPSG:900913:16', 'EPSG:900913:17', 'EPSG:900913:18']
      });

    viewer.imageryLayers.addImageryProvider(wmtsImageryProvider);

    viewer.camera.flyTo({
        destination : Cesium.Cartesian3.fromDegrees(109.637, 34.966, 100000),
        oridntation : {
            heading : Cesium.Math.toRadians(0.0),
            putch : Cesium.Math.toRadians(-25.0),
            roll : 0.0
        }
    });
    </script>

(3)GeoServer WMTS服务专用RESTful访问方式

仔细分析GeoServer服务器中GeoWebCache瓦片缓冲文件夹的命名方式,组合内部变量tileMatrix的默认值,可以通过修改url模板的方式构造出符合GeoServer WMTS要求的请求字符串,将url设置为以下形式:

url='/map/gwc/service/wmts/rest/pucheng:satellite/{style}/{TileMatrixSet}/{TileMatrixSet}:{TileMatrix}/{TileRow}/{TileCol}?format=image/png'

在这个url中,只是将{TileMatrix}替换成了{TileMatrixSet}:{TileMatrix},但是却可以再也不用重新定义冗长的tileMatrixLabels了,精减后的主要代码如下:

    <script>
      let wmtsImageryProvider = new Cesium.WebMapTileServiceImageryProvider({
        url : 'http://localhost:8080/geoserver/gwc/service/wmts/rest/pucheng:satellite/{style}/{TileMatrixSet}/{TileMatrixSet}:{TileMatrix}/{TileRow}/{TileCol}?format=image/png',
        style : 'raster',
        tileMatrixSetID : 'EPSG:900913'
      });

    viewer.imageryLayers.addImageryProvider(wmtsImageryProvider);

    viewer.camera.flyTo({
        destination : Cesium.Cartesian3.fromDegrees(109.637, 34.966, 100000),
        oridntation : {
            heading : Cesium.Math.toRadians(0.0),
            putch : Cesium.Math.toRadians(-25.0),
            roll : 0.0
        }
    });
    </script>

精减后的代码除了必须设置的url之外,就只剩下了style和tileMatrixSetID 这2个参数了,是不是一下子感觉清静了很多。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Cesium入门(五):加载WMTS瓦片地图服务 的相关文章

  • 什么是 JDK?

    JDK 是 Java Development ToolKit 的简称 xff0c 也就是 Java 开发工具包 JDK 是整个 Java 的核心 xff0c 包括 Java 运行环境 xff08 Java Runtime Envirnmen
  • 对《Java编程思想》读者的一点建议

    Java 编程思想 这本书在豆瓣的评分高达 9 1 分 xff0c 但我总觉得有点虚高 记得刚上大学那会 xff0c 就在某宝上买了一本影印版的 Java 编程思想 xff0c 但由于初学 Java xff0c 对编程极度缺乏信心 xff0
  • Caused by: java.lang.NumberFormatException: For input string: "performance-now.js"

    DEBUG 2019 01 08 10 43 53 507 org springframework web servlet DispatcherServlet Handler execution resulted in exception
  • spring mvc执行过程

    springMVC执行的过程 流程如下 xff1a 用户发起请求到前端控制器 xff08 DispatcherServlet xff09 xff0c 该控制器会过滤出哪些请求可以访问Servlet 哪些不能访问 就是url pattern的
  • 如何解决电脑无法访问个别网站

    今天重装系统后 xff0c 将所有的系统软件都安装了最新的版本 xff0c 在上网的过程中 xff0c 发现了一个奇怪的问题 xff0c 电脑可以访问网络 xff0c 但却有很多国内的网站都访问不了 xff0c 换了不同的浏览器测试也是同样
  • Springmvc基础

    springmvc入门 springmvc概述 controller层的框架 xff0c 代替Servlet xff0c 处理请求和响应 springmvc快速入门 64 Controller xff1a 将Bean交给Spring管理 x
  • Ocelot简易教程(五)之集成IdentityServer认证以及授权

    Ocelot简易教程目录 Ocelot简易教程 xff08 一 xff09 之Ocelot是什么Ocelot简易教程 xff08 二 xff09 之快速开始1Ocelot简易教程 xff08 二 xff09 之快速开始2Ocelot简易教程
  • 拿什么拯救你,我的团队

    一向认为软件开发就像是在搭房子或者说是在构建一座宏伟的大厦 xff0c 当然这根据工程的大小而定 其实细细想来软件工程的很多地方都是借助于建筑方面的知识 xff0c 就从 工程 这个词来说就是从建筑学引进的 xff0c 类似的还有设计模式
  • ubuntu开机跳过输入密码登录和默认桌面显示,直接启动图形应用程序,替换默认图形桌面

    1 自动登录 Ubuntu开机自动登录 xff0c 这个应该没什么难点 xff0c 自行百度 2 关闭默认的桌面和设置为自己的图形程序 到 usr share xsessions目录下 cd usr share xsessions ls 可
  • ubuntu服务器修改ssh登录用户名及端口

    1 如果默认的ssh登录用户名为ubuntu xff0c 需要开通root账户 xff0c 添加密码 xff1a passwd root 还需修改配置 xff0c 具体方法 xff1a vi etc ssh sshd config 确保一下
  • SpringBoot 集成 WebSocket 实现服务端消息主动推送

    目录 1 什么是websocket xff1f 2 使用Springboot开始整合webSocket3 前端websocket客户端4 测试验证 项目中用到了websocket进行大屏数据实时获取 xff0c 今天写个聊天室demo来进行
  • mysql authentication_string更改密码不成功的问题

    最近新买了电脑 xff0c 再重新安装mysql过程中 xff0c 发现user字段没有了password字段 xff0c update root密码失败 xff0c 发现最新版本更新为authentication string xff0c
  • vs qt 调试 输出 打印 到输出窗口 或控制台窗口

    printf只能输出 到控制台窗口 一 qt Qt日志重定向 xff08 将qDebug信息输出到界面控件 xff09 wx61a586bb4cf91的技术博客 51CTO博客 Windows版qt中 xff0c 如果是一个控制台应用程序
  • import matplotlib ImportError: cannot import name 'is_string_like'

    Traceback most recent call last File 34 321 py 34 line 2 in lt module gt import matplotlib pyplot as pt File 34 C Progra
  • Java多线程

    一 基础概念 1 CPU核心数和线程数 多核心指的是单芯片多处理器 xff0c 将多个CPU集成到同一个芯片内 xff0c 不同的CPU可以单独的运行程序 目前主流的CPU有四核 六核 八核 增加核心数目的是为了增加线程数 xff0c 一般
  • C++实现人脸识别(百度云平台)

    C 43 43 实现人脸识别 xff08 百度云平台 xff09 项目资源下载 项目思路 xff1a opencv 采集人脸照片 xff0c 将照片发送至百度智能云平台 xff0c 百度云平台与人脸库中的数据进行比较并返回结果 一 项目环境
  • 一文学会用 Docker 和 Docker Compose 部署 Node.js 微服务

    后端业务逻辑一般比较复杂 xff0c 全堆在一个 http 服务里不太现实 xff0c 所以基本都会用微服务架构来开发了 比如这样 xff1a 把不同模块的业务逻辑拆分到不同微服务里 xff0c 然后它们和主服务通过 tcp 通信 xff0
  • c++实现天干地支纪年法

    历史课上 老师 xff1a 1894 xff0c 甲午年 xff0c 中日发生甲午战争 学生 xff1a 家务是什么 xff1f 老师 xff1a 甲午 xff01 天干地支纪年法 学生 xff1a 什么是田赶地址 xff1f 老师 xff
  • 对三层和MVC的认识过程

    三层架构就是 MVC xff01 起初老师总说三层 MVC xff0c MVC 三层架构 所以开始的时候脑子就一个概念 xff1a 三层就是 MVC xff0c MVC 就是三层架构 而且想想也合理啊 xff0c 都是 三 MVC 是三个字
  • Spring入门详解(一)如何配置一个简单的spring项目

    关于spring的一些概念 xff0c 网上已经有很多的说明 xff0c 本系列不会做太多的描述 xff0c 重心在如何配置上 一 准备工作 1 安装JDK xff0c 配置环境 本来不想写这条的 想了想 xff0c 还是写上 2 下载开发

随机推荐

  • 超简洁的群晖交叉编译教程

    超简洁的群晖交叉编译教程 最近把一个群晖的NAS放在校园网里的时候遇到了锐捷认证的问题 xff0c 找了一下没有现成的程序可以拿来用 xff0c 然后自己交叉编译一个mentohust来用 1 环境 Ubuntu20 04 xff0c 先去
  • 基于docker部署nextcloud及其升级和问题修复

    之前用docker部署了一个版本的nextcloud xff0c 但是当时版本中存在一些bug xff0c 所以想升级一下 油管上有博主直接在nextcloud设置里更新的而且能用 这是地址 xff0c 懂的都懂 xff0c 但是我在nex
  • TFRecord的一些用法

    1 TFRecord的用法 首先 xff0c TFRecord是把你的数据存成文件的一个东西 所以首先要有个写文件的东西 xff0c 就是 writer span class token operator 61 span tf span c
  • rsync --exclude或者--exclude-from的路径问题

    先开个头 xff0c 注意 的使用 假设有 my src dir a 把 my src dir复制到 my dst dir xff0c 结果 my dst dir my src dir a rsync a my src dir my dst
  • Sentry迁移:从一台机器到另一台机器

    搜了一下 xff0c 目前写部署的帖子很多 xff0c 但是没找到比较完善的迁移的帖子 xff0c 记一下自己的方法吧 思路 因为现在基本都是使用docker部署 xff0c 所以常规思路大概是docker容器的迁移 xff0c 但是现在s
  • Android studio 2.3.3+Dlib

    最近因为需要 xff0c 尝试着将Dlib移植到android上 android小白一枚 xff0c 做之前没接触过android xff0c 所以就用了别人说比较好的android studio 最新稳定版 xff08 windows下
  • 用verilog实现L293D 驱动板接口

    课程实验做了一个蓝牙智能小车 xff0c nexys4开发板 xff0c MIPSfpga xff08 一个在 FPGA 上实现的商业 MIPS 处理器软核 xff0c Imagination Technologies公司提供给高校免费使用
  • 斐讯k2p openwrt固件改双WAN口

    原理参考教你玩转K2P A1 A2 官改版VLAN 步骤 xff1a network配置 xff0c etc config network里把wan的ifname由原来的eth1改成eth1 2增加wan2 xff0c eth1 3dhcp
  • windows 10安装Anaconda后pip报SSL错解决

    问题 新装的系统 xff0c 安装anaconda python 61 3 7 后 pip install xxx pip is configured with locations that require TLS SSL however
  • JSP中文乱码问题终极解决方案

    在介绍方法之前我们首先应该清楚具体的问题有哪些 xff0c 笔者在本博客当中论述的 JSP 中文乱码问题有如下几个方面 xff1a 页面乱码 参数乱码 表单乱码 源文件乱码 下面来逐一解决其中的乱码问题 一 JSP 页面中文乱码 在 JSP
  • ubuntu lightdm test用户自动登陆

    1 编辑 etc lightdm lightdm conf d 50 myconfig conf 内容 SeatDefaults autologin user 61 test 注意此处是自己要登陆的用户名字
  • 猴小萌的博客开通啦

    多年痴迷计算机技术 xff0c 孜孜不倦地学习着计算机的一切 xff0c 享受着计算机带给我的乐趣和满足感 然而有一天 xff0c 突然发现我所获得的知识和问题的答案基本上全部都来自于网络 xff0c 却从来没有为社区奉献过 xff0c 上
  • Cesium入门(一):第一张Cesium页面

    本章主要讲述如何下载和使用Cesium xff0c 编写完成自己的第一张Cesium应用页面 主要从以下几个方面展开叙述 xff1a 下载和部署CesiumJS编写第一张Cesium页面 1 下载和部署CesiumJS CesiumJS是一
  • Cesium入门(二):Viewer控件参数与外观定制

    本章主要介绍Cesium Viewer控件的选项参数 xff0c 以及如何对Viewer的外观进行定制 主要包括以下内容 xff1a Viewer控件Viewer选项参数定制Viewer外观界面 1 Viewer控件 Viewer是构建Ce
  • Cesium入门(三):加载WMS地图服务

    本章介绍Cesium Viewer控件的是如何加载地图的 xff0c 并以GeoServer服务器为例演示了WMS服务的加载过程 主要包括以下内容 xff1a ImageryProvider加载GeoServer发布的WMS服务 在Cesi
  • Cesium入门(四):叠加显示多个图层

    本章介绍Cesium Viewer控件的imageryLayers容器 xff0c 了解添加和叠加显示多个图层的方法 主要包括以下内容 xff1a imageLayers图层容器添加多个图层 1 imageryLayers图层容器 imag
  • GeoServer入门(一):发布第一个WMS图层

    本章主要讲述如何下载和安装使用GeoServer服务器 xff0c 介绍了GeoServer的管理界面 xff0c 并演示了发布地理数据的简单流程 主要从以下几个方面展开叙述 xff1a 下载和安装GeoServerGeoServer管理界
  • FreeBSD内存交换文件的设置与自动加载

    本文主要讲述FreeBSD操作系统下内存交换文件的作用及其自动加载过程 xff0c 主要从以下几个方面展开叙述 xff1a 交换文件的设置交换文件的自动加载 交换文件是虚拟内存机制的重要组成部分 xff0c 在物理内存不够用时可以临时将不常
  • GeoServer入门(二):WMTS图层瓦片切割与调用

    本章主要讲述如何GeoServer进行图层瓦片切割与缓冲 xff0c 发布标准的WMTS服务 xff0c 并介绍了REST格式的调用参数 主要包含以下内容 xff1a 图层切片与缓冲WMTS服务调用 在GeoServer入门 xff08 一
  • Cesium入门(五):加载WMTS瓦片地图服务

    本章介绍Cesium JS库的WebMapTileServiceImageryProvider类 xff0c 并以GeoServer为例演示了在CesiumViewer控件中添加瓦片图层的方法 主要包括以下内容 xff1a WebMapTi