Qgis加载在线XYZ瓦片影像服务的实践操作

不念不忘少年蓝@ 2023-10-12 16:58 62阅读 0赞

**目录**

背景

一、XYZ瓦片相关知识

1、xyz瓦片金字塔

2、 瓦片编号

3、瓦片访问

二、在Qgis中加载在线地图

1、Qgis版本

2、瓦片加载

3、地图属性预览

总结

--------------------

## 背景 ##

在做电子地图应用的时候，很常见的会提到瓦片（tile）的概念，瓦片相当于是一张一张的地图。为了提高地图的访问效率，在页面上访问地图时，通常是把底图切割成256 \* 256大小的一张张瓦片，最后拼接起来形成一个世界。

瓦片通常作为底图的方式进行加载，一般规划或者设计人员在影像底图的基础上再叠加相应的路网、水系、河流、土地规划分类图斑等矢量信息。将两者进行良好的结合。常用的一些gis工具有Arcgis或者Qgis等等，除了一些web网页上访问地图。如何在Qgis等软件中进行XYZ影像的加载也是需要掌握的。本文将简单介绍XYZ瓦片的基础知识，然后介绍在Qgis如何加载星图地图影像，最后简单列一下两个可以在线访问的遥感影像底图网站，供大家参考学习使用。

## 一、XYZ瓦片相关知识 ##

### 1、xyz瓦片金字塔 ###

目前我们所见的所有地图底图服务都是瓦片地图的方式发布的。瓦片地图金字塔模型是一种多分辨率层次模型，从瓦片金字塔的底层到顶层，分辨率越来越低，但表示的地理范围不变。

当我们建立好了影像金字塔后，前端再请求地图时，则将只是在切好的瓦片缓存中，找到对应级别里对应的瓦片即可。然后在前端将这些请求到的瓦片拼接出来，便可以得到用户需要的级别下的可视范围内的瓦片了。

![dae7c1e2db4475ebf0a1a66f9bde1401.jpeg][]

Web墨卡托投影以后，地球变为一张图。zoom（缩放级别）级别高的时候要看宏观的地图信息，zoom级别小的时候需要看围观的地图信息。比如瓦片就是zoom=1的时候，可能只有一张图，在下一级别4个瓦片，再下一级别是16个瓦片。这样就形成了一个金字塔坐标系。金字塔从技术上解决了大规模场景下的地图展示的问题。通过瓦片和金字塔解决了浏览问题。

![7b5fb60f16b84370b8884eab2329b551.png][]

### 2、 瓦片编号 ###

地图是有很多瓦片组成，而每一张瓦片有对应的瓦片等级（z）和瓦片坐标编号（x, y），目前互联网地图也是通过xyz值是可以找到对应的瓦片的。这个类似于我们URI，互联网上每一张地图都是可以通过xyz参数来进行访问到的。

**星图地球**

使用谷歌浏览器打开星图地球的地图浏览地址：[星图地球今日影像][Link 1]，在打开的界面中可以看到一下的界面。使用谷歌浏览器可以按F12进入调试页面，可以观察页面资源的请求情况，这个很重要，这个技能很重要，不了解的朋友可以查阅相关知识学习掌握。

![c89fddb2332248d7a53fa4d7369cb8a5.png][]

使用F12调试后可以看到很多瓦片的请求，同时响应端也生成了一张一张的瓦片。仔细观察响应的话，可以看到，除了基础影像底图还有标注底图。

![5b0e40f876c546499e999fdebcd33ead.png][]

![63ab1d52556045a79a1531a0a5d1daed.png][]

感兴趣的同学，可以自己使用同样的方法来查看百度和高德地图的瓦片展示方式，原理基本上是一致的。

![97893c91196547baa562cddac28b78ee.png][]

### 3、瓦片访问 ###

做了上面实验的同学，如果细心观察网络请求的请求地址和响应信息以及响应的报文信息后，应该会发现一些通用的规律。

**星图影像底图访问地址：**

https://tiles2.geovisearth.com/base/v1/img/9/412/216?
    
    secretId=H7ILfZkmmyCjwSYt5doCpsABO6A&clientId=caa9e56a-615b-4cdf-e566-
    
    29e5784eb31d&expireTime=1687048132&sign=2e7a293a7c0642117d1e45ce2b4483d3cd183223361a51c75
    
    5b75a4d04aa41f5

**星图影像底图标注访问地址：**

https://tiles2.geovisearth.com/base/v1/cia/9/412/216?secretId=H7ILfZkmmyCjwSYt5doCpsABO6A&clientId=caa9e56a-615b-4cdf-e566-29e5784eb31d&expireTime=1687048132&sign=2e7a293a7c0642117d1e45ce2b4483d3cd183223361a51c755b75a4d04aa41f5

注意观察上面的请求地址，可以发现，在访问地址中，都有/9/412/216等信息，后面的secretId、clientId及expireTime等信息暂且不管。/9/412/216这串信息对我们是最有用的。知道了这串数字就知道了瓦片对应的ZXY编号关系。其中Z表示地图的层级信息。

## 二、在Qgis中加载在线地图 ##

### 1、Qgis版本 ###

演示采用的Qgis的版本是3.16版本的，这里对Qgis的版本没有要求，使用较新的版本都是可以进行预览访问的。以下是本实例采用的具体版本参数，供参考。

![440946529f074d6db4d35c7d3642e750.png][]

### 2、瓦片加载 ###

在前面的节点中，讲述了ZXY瓦片的访问方式，在Qgis中内置了连接底图的功能点。下面跟着教程来进行一步一步操作，对一些重点参数将做详细说明。

**新建XYZ Tiles连接**

在Qgis中，浏览器窗口中选择xyz tiles连接，鼠标右键点开新建连接，弹出如下界面：

![e4895e7227f0418687123a6f2e76e70a.png][]

**参数说明：**

<table> 
 <tbody> 
  <tr> 
   <td style="width:90px;">序号</td> 
   <td style="width:142px;">参数</td> 
   <td style="width:456px;">参数值</td> 
  </tr> 
  <tr> 
   <td style="width:90px;">1</td> 
   <td style="width:142px;">名称</td> 
   <td style="width:456px;">新建xyztiles连接名称，如星图地球影像底图</td> 
  </tr> 
  <tr> 
   <td style="width:90px;">2</td> 
   <td style="width:142px;">url</td> 
   <td style="width:456px;">http://xxx/{z}/{x}/{y}.png</td> 
  </tr> 
  <tr> 
   <td style="width:90px;">3</td> 
   <td style="width:142px;">认证</td> 
   <td style="width:456px;">访问瓦片的认证信息</td> 
  </tr> 
  <tr> 
   <td style="width:90px;">4</td> 
   <td style="width:142px;">最小缩放</td> 
   <td style="width:456px;">0</td> 
  </tr> 
  <tr> 
   <td style="width:90px;">5</td> 
   <td style="width:142px;">最大缩放</td> 
   <td style="width:456px;">18（取决地图瓦片的最大层级）</td> 
  </tr> 
  <tr> 
   <td style="width:90px;">6</td> 
   <td style="width:142px;">参考</td> 
   <td style="width:456px;">空间参考信息</td> 
  </tr> 
  <tr> 
   <td style="width:90px;">7</td> 
   <td style="width:142px;">图块分辨率</td> 
   <td style="width:456px;">标准/高，标准为256 * 256；高为512* 512</td> 
  </tr> 
 </tbody> 
</table>

这里配置的url请注意，已星图地球为例，将/9/412/216替换成\{z\}/\{x\}/y后，其它参数不变。如下图所示：

![efc17f0c20634c5ab9406f2c9e611fd9.png][]

完成后点击OK按钮完成xyz tiles的地图配置。

### 3、地图属性预览 ###

鼠标右键点击地图属性，可以看到刚才添加的地图的属性信息。

![e64623b31c324727b0d3e6e4d58e9741.png][]

![2e991acaaec54331b4435c61fd66ec39.png][]

还可以对加载地图信息进行预览操作，在tab选项卡中进行预览。

![cff0438c6b344bc590633e95f6216b97.png][]

使用同样的方法可以将星图地球的标注图层也添加到工作空间当中，把标注图层叠加到一起会更美观。在配置好的图层上双击，即可将地图在qgis中进行展示。

![e68761fdf1ea48439202aea9374c3a1c.png][]

## 总结 ##

以上就是本文的主要内容，文章简单介绍XYZ瓦片的基础知识，然后介绍在Qgis如何加载星图地图影像，最后简单列一下两个可以在线访问的遥感影像底图网站，供大家参考学习使用。文中罗列的方法供参考，图源信息用作学习使用。

文章部分图和文字引用来源以下文章：

1、[https://www.wenjiangs.com/][https_www.wenjiangs.com]

2、[【森城市】GIS数据漫谈（十二）— 地图瓦片（切片）服务][GIS_]

3、[关于使用X/Y/Z的方式加载地图Tile瓦片的知识总结][X_Y_Z_Tile]

4、[瓦片是什么意思？][Link 2]

[dae7c1e2db4475ebf0a1a66f9bde1401.jpeg]: https://img-blog.csdnimg.cn/img_convert/dae7c1e2db4475ebf0a1a66f9bde1401.jpeg
[7b5fb60f16b84370b8884eab2329b551.png]: https://img-blog.csdnimg.cn/7b5fb60f16b84370b8884eab2329b551.png
[Link 1]: https://daily.geovisearth.com/#/jyzx
[c89fddb2332248d7a53fa4d7369cb8a5.png]: https://img-blog.csdnimg.cn/c89fddb2332248d7a53fa4d7369cb8a5.png
[5b0e40f876c546499e999fdebcd33ead.png]: https://img-blog.csdnimg.cn/5b0e40f876c546499e999fdebcd33ead.png
[63ab1d52556045a79a1531a0a5d1daed.png]: https://img-blog.csdnimg.cn/63ab1d52556045a79a1531a0a5d1daed.png
[97893c91196547baa562cddac28b78ee.png]: https://img-blog.csdnimg.cn/97893c91196547baa562cddac28b78ee.png
[440946529f074d6db4d35c7d3642e750.png]: https://img-blog.csdnimg.cn/440946529f074d6db4d35c7d3642e750.png
[e4895e7227f0418687123a6f2e76e70a.png]: https://img-blog.csdnimg.cn/e4895e7227f0418687123a6f2e76e70a.png
[efc17f0c20634c5ab9406f2c9e611fd9.png]: https://img-blog.csdnimg.cn/efc17f0c20634c5ab9406f2c9e611fd9.png
[e64623b31c324727b0d3e6e4d58e9741.png]: https://img-blog.csdnimg.cn/e64623b31c324727b0d3e6e4d58e9741.png
[2e991acaaec54331b4435c61fd66ec39.png]: https://img-blog.csdnimg.cn/2e991acaaec54331b4435c61fd66ec39.png
[cff0438c6b344bc590633e95f6216b97.png]: https://img-blog.csdnimg.cn/cff0438c6b344bc590633e95f6216b97.png
[e68761fdf1ea48439202aea9374c3a1c.png]: https://img-blog.csdnimg.cn/e68761fdf1ea48439202aea9374c3a1c.png
[https_www.wenjiangs.com]: https://www.wenjiangs.com/doc/n8yzf7945i5r#384657af2e86fb34a1d8af127bbd96cc
[GIS_]: http://developer.thingjs.com/article-171-1.html
[X_Y_Z_Tile]: https://blog.csdn.net/m0_37251750/article/details/119104828
[Link 2]: https://blog.csdn.net/weixin_44700978/article/details/124311842