docker实现离线地图server
- 一:背景
- 二:技术栈
- 三:安装准备
- 3.1:安装配置docker
- 3.2:准备瓦片文件
- 3.3:下载所需的git.js 和 CntenLomap.js文件
- 四:启动离线地图服务
- 4.1下载镜像
- 4.2运行容器
- 五项目中集成map server
- 5.1在html中引入相应的js和css文件
- 5.2body标签中增加地图渲染的div
- 5.3 修改git.js 中的ip修改为地图server 的ip
- 结束
- 学习交流联系本人qq:914423503
一:背景
各位大佬们大家好。公司有项目需要集成离线地图功能。我之前曾经将百度成功离线,只是版本比较低。如图
但是总感觉百度离线地图不太好控制,因为很多api都是百度已经实现,功能也不好扩展,于是我一咬牙,准备自己写一套离线地图服务,结果就走上了一条不归路~ ~
二:技术栈
经过的我的一系列努力,终于将技术栈确定:node js + openlayers + XXXXXX.mbtiles
- node js :简单的说 Node.js 就是运行在服务端的 JavaScript。(自己学习纯属想实践用一下);
- openlayers:一个专为Web GIS 客户端开发提供的JavaScript 类库包,用于实现标准格式发布的地图数据访问;
- XXXXXX.mbtiles :地图瓦片数据。.mbtiles格式是可以通过sqllite打开的文本数据库。可以通过水经注软件下载(收费,下载慢,收费);
三:安装准备
3.1:安装配置docker
docker 安装非常简单,安装流程是 1.配置docker安装源。2.安装docker 3.设置镜像加速
3.2:准备瓦片文件
我这里下载的是北京市的瓦片文件,文件名称是beijing_e_19.mbtiles。并移动到/App/map/beijing_e_19.mbtiles目录中。如图
3.3:下载所需的git.js 和 CntenLomap.js文件
1.文件仓库:https://github.com/914423503/linemap.git 将该仓库克隆到本地
2.将git.js 移动到 /App/map/。如图
3.修改git.js 中IP地址:(我的虚拟机中ip是:192.168.1.79)如图
四:启动离线地图服务
4.1下载镜像
用docker下载地图镜像:docker pull 914423503/linemap:latest
4.2运行容器
运行docker容器:
docker run -d -p 3000:3000 -v /App/map:/map -v /App/map/script/git.js:/app/public/javascripts/git.js 914423503/linemap:latest
========================================================================
至此地图服务已经启动完毕。浏览器输入http://ip:3000/gis 即可访问。如图:
![访问
五项目中集成map server
做这个地图server的根本目的是在项目中使用,接下来会将地图server和项目的集成,加以说明。已经封装的非常简单
完整代码:https://github.com/914423503/linemap/tree/master/demo
5.1在html中引入相应的js和css文件
<link rel="stylesheet" href="css/ol.css"/>
<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/ol.js" type="text/javascript"></script>
<script src="js/CntenLomap.js" type="text/javascript"></script>
<script src="js/git.js" type="text/javascript"></script>
5.2body标签中增加地图渲染的div
<div class="mapContainer" style="height: 100%;">
<div id="map" class="map" style="height: 100%;">
<div id="popup">
<div id="popup-content">
</div>
</div>
</div>
</div>
5.3 修改git.js 中的ip修改为地图server 的ip
noce 连我的爱上我自己了
结束
至此,一个完整的离线地图服务搭建完毕。并且可以集成到自己的项目中。谢谢大家的支持与阅读。
学习交流联系本人qq:914423503
Github:https://github.com/914423503
docker:914423503/otomcat,914423503/geoservertomcat
csdn:https://blog.csdn.net/u010403700
[1]: https://github.com/914423503
[2]: https://blog.csdn.net/u010403700
[3]: 914423503/otomcat,914423503/geoservertomcat