【转载】TMS协议简介

797 阅读2分钟

3b41e5392705c86f717b05654482ee6f.png

tms协议

TMS简介

TMS是tile map service的简写。是一种瓦片服务。Tile Map Service或TMS是由开放源码地理空间基金会开发的平铺web地图规范。这个定义通常需要一个URI结构来尝试实现REST原则。TMS协议填补了OpenStreetMap使用的非常简单的标准和Web地图服务标准的复杂性之间的空白,提供了简单的URL到分幅,同时还支持备用空间引用系统。

维基百科地址:

en.wikipedia.org/wiki/Tile_M…

查看工具

为了能够查看我们的tms是否正常,我们需要寻找一款工具来查看,这里推荐使用QGIs工具。Qgis失败了,可能是tms服务没搞好。

服务的相关文档看下面的介绍。

Tile Map Service Specification

参考网址:

wiki.osgeo.org/wiki/Tile_M…

blog.csdn.net/u011365716/…

blog.csdn.net/lp_cq242/ar…

参考这篇文章,大概可以知道我们的tms服务应该如何去设置

最终需要一个tilemapresource.xml的文件来描述瓦片。

瓦片下载

这里我们采用BIGEMAP地图下载器,下载截图如下:由于是webwgs84 所以我们要设置的纬度到不了90,这是是

85.05112877980659

地图采用的是天地图,设置如下:

c1b82d671b3a55f871a8f62fec642ec4.png

下载之后的数据如下:注意我这里原先第一个是1 ,需要修改成0

33c6e131d6d09e42e081e2b6556d5f94.png

TMS服务启动

另外,我们还需要启动tms服务,还需要设置一个文件tilemapresource.xml

内容如下:

<?xml version="1.0" encoding="utf-8"?>
 <TileMap version="1.0.0" tilemapservice="http://tms.osgeo.org/1.0.0">
 <Title>NE2_HR_LC_SR_W_DR_recolored.tif</Title>
 <Abstract></Abstract>
 <SRS>EPSG:4326</SRS>
 <BoundingBox miny="-90.00000000000000" minx="-180.00000000000000" maxy="90.00000000000000" maxx="180.00000000000000"/>
 <Origin y="-90.00000000000000" x="-180.00000000000000"/>
 <TileFormat width="256" height="256" mime-type="image/png" extension="png"/>
 <TileSets profile="geodetic">
 <TileSet href="0" units-per-pixel="0.70312500000000" order="0"/>
 <TileSet href="1" units-per-pixel="0.35156250000000" order="1"/>
 <TileSet href="2" units-per-pixel="0.17578125000000" order="2"/>
 <TileSet href="3" units-per-pixel="0.08789062500000" order="3"/>
 <TileSet href="4" units-per-pixel="0.0439453125" order="4"/>
 <TileSet href="5" units-per-pixel="0.02197265625" order="5"/>
 <TileSet href="6" units-per-pixel="0.010986328125" order="6"/>
 <TileSet href="7" units-per-pixel="0.0054931640625" order="7"/>
 <TileSet href="8" units-per-pixel="0.00274658203125" order="8"/>
 <TileSet href="9" units-per-pixel="0.001373291015625" order="9"/>
 <TileSet href="10" units-per-pixel="0.0006866455078125" order="10"/>
 <TileSet href="11" units-per-pixel="3.4332275390625e-4" order="11"/>
 <TileSet href="12" units-per-pixel="1.71661376953125e-4" order="12"/>
 <TileSet href="13" units-per-pixel="8.58306884765625e-5" order="13"/>
 <TileSet href="14" units-per-pixel="4.291534423828125e-5" order="14"/>
 <TileSet href="15" units-per-pixel="2.145767211914063e-5" order="15"/>
 <TileSet href="16" units-per-pixel="1.072883605957031e-5" order="16"/>
 <TileSet href="17" units-per-pixel="5.364418029785156e-6" order="17"/>
 </TileSets>
 </TileMap>

加载TMS服务

这里我计划采用cesium来加载测试,先下载cesium的js包,然后写一个html文件,但是还是一直出错,原因未知,可能是数据的原因。

<!DOCTYPE html>
<html lang="en">


<head>
<!-- Use correct character set. -->
<meta charset="utf-8">
<!-- Tell IE to use the latest, best version. -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- Make the application on mobile take up the full browser screen and disable user scaling. -->
<meta name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<title>Hello World!</title>
<script src="Cesium/Cesium.js"></script>
<style>
@import url(Cesium/Widgets/widgets.css);


html,
body,
#cesiumContainer {
width100%;
height100%;
margin0;
padding0;
overflow: hidden;
    }
</style>
</head>


<body>
<div id="cesiumContainer"></div>
<script>
var url = 'http://localhost:8081/'// tms 瓦片地址 
var viewer = new Cesium.Viewer('cesiumContainer', {
imageryProvidernew Cesium.TileMapServiceImageryProvider({
url: url
      }),
baseLayerPickerfalse
    });
</script>
</body>


</html>

让我们来看下我用cesium调用的结果:

b4ea9611d871d390e8ea22b9b196d3b1.png

Cesium示例资源

github.com/CesiumGS/ce…

cesium提供了示例的格式,我们可以用这个来参考填写。