OpenLayer加载离线天地图切片

程序员文章站 2022-07-01 22:21:48

...

天地图为免费的地图服务，使用WGS84坐标系，通过下载工具下载的地图切片，通过搭建虚拟路径可以用OpenLayer进行请求，具体步骤如下：

1.配置天地图虚拟路径服务地址：

tomcat虚拟路径：打开server.xml放在host标签内： <Context docBase="D:\tiandituTitle" reloadable="true" debug="0" path="/tiandituTitle"/>

docBase：为切片存放的路径；

path：为服务地址名称参数；

2.设置tomcat端口为8087；

3.实现代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>OpenLayer加载离线天地图切片</title>
    <link href="../css/ol.css">
    <script src="../js/ol,js.js"></script>
    <script src="../js/jquery-1.3.1.js"></script>
</head>
<body>
<div id="map" style="height: 70%;">
</div>
</body>
<script>
    var tiandituLayer=new ol.layer.Tile({
        source:new ol.source.XYZ({
            url:"http://localhost:8087/tiandituTitle/{z}/{y}/{x}.png"    //加载天地图离线地图地址
        })
    })
    var view =new ol.View({
        projection:'EPSG:4326',
        zoom:12,
        center:[106.750102,25.435957]
    })
    //天地图加载方式
    var map=new ol.Map({
        target:'map',
        layers:[tiandituLayer],
        view:view
    })
</script>
</html>

参考资料

加载离线瓦片地图

相关标签：天地图离线地图 OpenLayer 地图瓦片

上一篇：吃什么食物对流产有好处流产后吃什么好

下一篇：掉发严重是什么原因如何养发护发