1、背景
在離線環境下（區域網路中）的GIS系統中如何使用地圖？這裡的地圖主要指的是地圖底圖，有了底圖切片資料，我們就可以看到地圖，在上面加上自己的業務資料圖層，進行相關操作。
要在離線環境下看到GIS地圖，就要有底圖切片資料，地圖的底圖切片資料在一定時間内是不會變化的，可以使用一些地圖下載下傳器下載下傳地圖切片，如這個地圖下載下傳器。
在CS系統中可以基于GMap.Net來做，參考《百度谷歌離線地圖解決方案》。
下面介紹下Web系統如何使用GIS切片資料，開發web GIS系統。
2、使用GeoWebCache釋出WMS服務
Geowebcache是基于Java的Web開源項目，主要用于緩存各種WMS資料源的地圖瓦片，它實作了多種服務接口，包括WMS-C，WMTS，TMS，KML。
Geowebcache作為一個獨立的開源項目，在最近被Geosever的幾個版本所內建，主要是對釋出的WMS圖層建立緩存切片。
服務釋出步驟：
1）官網下載下傳 geowebcache-1.8.0-war.zip，直接解壓得到geowebcache.war檔案，将該檔案直接拷貝至tomcat目錄下的webapps下即可，啟動tomcat會對war包進行解壓。
2）修改geowebcache的配置檔案geowebcache-core-context.xml。該檔案在Tomcat的webapps\geowebcache\WEB-INF下，修改如下：
<bean id="gwcXmlConfig" class="org.geowebcache.config.XMLConfiguration">
<constructor-arg ref="gwcAppCtx" />
<!--<constructor-arg ref="gwcDefaultStorageFinder" />-->
<constructor-arg value="D:\\GisMap\\" />
<!-- By default GWC will look for geowebcache.xml in {GEOWEBCACHE_CACHE_DIR},
if not found will look at GEOSEVER_DATA_DIR/gwc/
alternatively you can specify an absolute or relative path to a directory
by replacing the gwcDefaultStorageFinder constructor argument above by the directory
path, like constructor-arg value="/etc/geowebcache"
-->
<property name="template" value="/geowebcache.xml">
<description>Set the location of the template configuration file to copy over to the
cache directory if one doesn't already exist.
</description>
</property>
</bean> 修改gwcXmlConfig執行個體化時使用固定路徑，該路徑可以為任意建立路徑檔案夾。Geowebcache啟動之後會檢查此檔案夾下是否存在gewebcache.xml檔案，如果不存在則按模闆建立立并讀取使用，如果存在則直接讀取使用。
3）修改第2步中的gewebcache.xml檔案：
<layers>
<arcgisLayer>
<name>ARCGIS-Demo</name>
<tilingScheme>D:\\GisMap\\Layer\\conf.xml</tilingScheme>
<tileCachePath>D:\\GisMap\\Layer\\_alllayers</tileCachePath>
</arcgisLayer>
</layers> 在layers節點裡添加arcgisLayer節點（預設生成的gewebcache.xml的layers節點有許多其他備援資料，可删除可保留）。Name節點表示待添加圖層的名稱（這裡配置為ARCGIS-Demo），titlingscheme節點為conf.xml檔案的路徑，tileCachePath為瓦片資料的路徑。
4）瓦片地圖的準備
其中conf.xml為配置檔案，conf.cdi為顯示區域限制檔案，_alllayers檔案夾下則存放了切片資料，Status.gdb為切片狀态情況記錄（可直接删除）。
通過瓦片下載下傳器下載下傳瓦片地圖，然後生成的切片資料_alllayers檔案夾：
L01-L10表示地圖縮放級數，按照ArcGIS切片目錄組織，切片命名規則也和ArcGIS切片資料命名規則一緻。（conf.xml、conf.cdi和_alllayers在同級目錄）。
5)啟動tomcat，繼而啟動Geowebcache服務，浏覽器通路 localhost:8080/geowebcache，如果一切正确的話可以看到下面的頁面
該頁面簡單說明了Geowebcache的一些情況。
點選“A list of all the layers and automatic demos”連接配接可以看到下面：
該頁面顯示了geowebcache.xml配置的圖層資訊。圖中可以看到隻配置了一個名字為ARCGIS-Demo的圖層，使用的EPSG3857坐标系，釋出的圖檔格式為png格式，點選png連結即可看到瓦片地圖。
這裡地圖顯示的級别和坐标系配置都來自conf.xml檔案。這裡的前端js使用的是Openlayers。檢視網頁源碼：
View Code
個人比較喜歡leaflet這個GIS javascript庫，使用leaflet加載GeoWebCache釋出的這個服務：
<!DOCTYPE html>
<html>
<head>
<title>Leaflet - Offline Demo</title>
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css" />
<script src="https://unpkg.com/[email protected]/dist/leaflet.js"></script>
</head>
<body>
<div id="map" style="height:100vh;" ></div>
<script type="text/javascript">
var mapCenter = new L.LatLng(32.1280, 118.7742); //南京
var map = new L.Map('map', {
center : mapCenter,
zoom : 4
});
var wmsLayer = L.tileLayer.wms("http://localhost:8080/geowebcache/service/wms", {
layers: 'ARCGIS-Demo',
format: 'image/png'
});
wmsLayer.addTo(map);
var marker = new L.Marker(mapCenter);
map.addLayer(marker);
marker.bindPopup("<p>Hello! ;}</p>").openPopup();
</script>
</body>
</html> 3、使用自定義的Http服務
GeowebCache本質上就是個Http服務，通過請求參數擷取配置檔案中的路徑中的切片資料，傳回給請求方。
我們可以自己寫個獨立的Http服務，從資料庫中讀取切片資料傳回給請求方。
切片請求位址類似：http://localhost:8899/1818940751/{z}/{x}/{y}
其中“1818940751”是下載下傳器下載下傳的地圖類型，z/x/y分别是zoom和地圖切片行列号。
前端js使用leaflet加載：
var amapNormalUrl = 'http://localhost:8899/788865972/{z}/{x}/{y}';
var amapNormalLayer = new L.TileLayer(amapNormalUrl, {
minZoom : 1,
maxZoom : 18,
attribution : '高德普通地圖'
});
var mapCenter = new L.LatLng(32.1280, 118.7742); //南京
var map = new L.Map('map', {
center : mapCenter,
zoom : 9,
minZoom: 1,
maxZoom: 18,
layers : [ amapNormalLayer ]
}); 前端js可以自定義投影Projection算法，而國内google地圖、高德地圖和騰訊地圖都是标準的墨卡托投影，可以直接用leaflet加載。
配合一些畫圖插件，再配合一些背景POI檢索服務，如：
《使用Lucene索引和檢索POI資料》
《使用Solr進行空間搜尋》
則能做出如下效果：
總結：介紹了如何使用下載下傳的離線切片資料在區域網路環境下釋出Web GIS地圖服務，前端配合使用一些js插件，實作web下空間資料的檢索。
附件：
conf.cdi
conf.xml
參考：
http://leafletjs.com/
http://leafletjs.com/examples/quick-start/
http://www.cnblogs.com/luxiaoxun/p/4454880.html
http://www.cnblogs.com/luxiaoxun/p/5020247.html
http://www.cnblogs.com/luxiaoxun/