请选择 进入手机版 | 继续访问电脑版
分享
首页 资讯 技术分享 查看内容

【森城市】GIS数据漫谈(十一)— 地图瓦片(切片)服务

发表于 2022-7-1 17:30
zzv_icon2753 zzr_icon0
摘要: 05TMS地图服务在OGC发布WMTS标准之前,更早一些的一种地图瓦片标准是OSGeo发布的 TMS 标准。它与WMTS标准最大的不同就是瓦片索引的组织方式。前面我们看到了 WMTS是:Z 表示缩放层级,XY 的原点在左上角,X 从左向右 ...

05

TMS地图服务

在OGC发布WMTS标准之前,更早一些的一种地图瓦片标准是OSGeo发布的 TMS 标准。它与WMTS标准最大的不同就是瓦片索引的组织方式。

前面我们看到了 WMTS是:

Z 表示缩放层级,XY 的原点在左上角,X 从左向右,Y 从上向下。

【森城市】GIS数据漫谈(十一)— 地图瓦片(切片)服务

而 TMS是:

Z 表示缩放层级,XY 的原点在左下角,X 从左向右,Y 从下向上

【森城市】GIS数据漫谈(十一)— 地图瓦片(切片)服务

以Web墨卡托投影的TMS服务具体举例就是:

【森城市】GIS数据漫谈(十一)— 地图瓦片(切片)服务

可见TMS切片的Y轴正好与WMTS的Y轴“相反”。因此在API 中,之前用 {y} 的“占位符”就要变成 {reverseY}。

【森城市】GIS数据漫谈(十一)— 地图瓦片(切片)服务


在 QGIS 中加载 XYZTiles 如果是 TMS 标准的瓦片也是用的 {-y} 作为“占位符”。

案例


TMS
以用GeoServer发布的TMS服务为例,同样可以查看他的元数据。这里面还是关注坐标系信息,同样需要是Web墨卡托投影坐标系。

【森城市】GIS数据漫谈(十一)— 地图瓦片(切片)服务

然后就可以根据 TileSet 中的信息拼出 url。

http://10.100.42.51:8080/geoserver/gwc/service/tms/1.0.0/myTest:simpleWorld@EPSG:900913@png/{z}/{x}/{reverseY}.png

在 ThingJS 在线开发中加载,代码如下:

var app = new THING.App();app.background = [0, 0, 0];THING.Utils.dynamicLoad(['https://www.thingjs.com/uearth/uearth.min.js'], function () {    // 新建一个地图    var map = app.create({        type: 'Map'    });    var url = 'http://10.100.42.51:8080/geoserver/gwc/service/tms/1.0.0/myTest:simpleWorld@EPSG:900913@png/{z}/{x}/{reverseY}.png';    // 新建一个瓦片图层    var tileLayer1 = app.create({        type: 'TileLayer',        id: 'tileLayer1',        url,    });    map.addLayer(tileLayer1);});

【森城市】GIS数据漫谈(十一)— 地图瓦片(切片)服务

总结:

1.我们支持对接OSGeo标准的TMS地图瓦片服务。

2.TMS地图瓦片服务的坐标系支持Web墨卡托投影坐标系(EPSG:3857/900913)。




工具推荐



森城市:一键生成3D城市,内置多种模板,自由编辑

• 森城市支持不同类型城市数据的插入和自动融合,并提供友好而强大的场景编辑能力和性能处理能力,无需具备GIS、建模等专业技能,就可以轻松DIY自己的酷炫城市三维场景。

• 森城市具备开放的城市场景输出能力,无需担心场景后续使用的兼容问题。

低代码ThingJS:低代码灵活开发数字孪生可视化应用

• 低代码ThingJS提供了丰富的3D开发API、完善的开发文档和视频教程,熟悉基础的JavaScript前端知识即可上手数字孪生3D可视化应用开发

• 低代码ThingJS是纯H5的WebGL架构,可在各类主流网页浏览器中自如运行,包括可在移动端直接访问运行。

• 低代码ThingJS提供全生命周期的开发组件,大大提升数字孪生可视化项目开发效率。

相关文章