docker實現離線地圖server

一：背景

各位大佬們大家好。公司有項目需要集成離線地圖功能。我之前曾經將百度成功離線，只是版本比較低。如圖

但是總感覺百度離線地圖不太好控制，因爲很多api都是百度已經實現，功能也不好擴展，於是我一咬牙，準備自己寫一套離線地圖服務，結果就走上了一條不歸路~ ~
​​

二：技術棧

經過的我的一系列努力，終於將技術棧確定：node js + openlayers + XXXXXX.mbtiles

1. node js :簡單的說 Node.js 就是運行在服務端的 JavaScript。(自己學習純屬想實踐用一下)；
2. openlayers:一個專爲Web GIS 客戶端開發提供的JavaScript 類庫包，用於實現標準格式發佈的地圖數據訪問；
3. 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