在我們很方便的用各類JS API實現(xiàn)在線地圖加載的同時，卻也讓我們忽略了很多原理性的東西该押。前幾日還因為項目需要下載影像地圖，但是實在不忍用”某某電子地圖下載工具”的廣告轟炸各群來騷擾各位群友阵谚。于是擼起袖子蚕礼，自己干！

做這事之前要分好以下幾個技術步驟：

STEP1?搞清楚瓦片數(shù)據(jù)在WEBGIS中的組織結構梢什。

STEP2找到屏幕坐標與地理坐標（實際坐標）的換算關系奠蹬。

STEP3根據(jù)地理范圍換算出瓦片行列號。

STEP4前端繪制瓦片绳矩。

“瓦片數(shù)據(jù)在WEBGIS中的組織結構”

我們在訪問高德地圖或者百度地圖的時候罩润，會發(fā)現(xiàn)游覽器是一塊一塊加載地圖的玖翅，如果網(wǎng)絡條件不佳翼馆，在地圖中還會出現(xiàn)空白塊的情況。在WEBGIS領域中金度，我們通常把這個過程稱為”加載瓦片”的過程应媚，地圖瓦片的實質就是一張張固定寬高的圖片，當游覽器加載地圖的時候猜极，其實質也是游覽器在向遠程服務器請求這些圖片的過程中姜。

? ? ? 既然加載在線地圖是一個請求服務器圖片資源的過程，我們可以通過網(wǎng)絡抓包工具看到請求地址跟伏，如下圖所示就是在線地圖請求的過程丢胚。

（以Arcgis Online地圖為例：

http://cache1.arcgisonline.cn/arcgis/rest/services/ChinaOnlineCommunity/MapServer）

可以看到，其地圖圖片的請求地址為

https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/16/26785/54862

經(jīng)過平移地圖受扳，縮放地圖等操作携龟，可以發(fā)現(xiàn)這個請求地址變化的地方就是最后三個參數(shù)，不難發(fā)現(xiàn)第一個參數(shù)和當前地圖顯示的級別相對應勘高。那么后面兩個參數(shù)該如何理解呢峡蟋？

我們可以這么想象，把一張矩形地圖（完整地圖）华望，按照一定的規(guī)律（按照切圖原點蕊蝗，切圖范圍，瓦片大欣抵邸）蓬戚，分成了很多個大小相同的矩形，那么每一個矩形所在的位置就可以用行列號的形式來表達宾抓。按照這樣的邏輯來看碌更，剩余的那兩個參數(shù)應該就是上面所說的行列號了裕偿。

下面我們將上述總結的規(guī)律抽象為數(shù)學概念就可以把三參數(shù)分別理解為ZXY值，這是一個三維的概念痛单，Z值用來表達地圖層級嘿棘，而XY表示某個層級內的瓦片平面，X為橫軸坐標即為列旭绒，Y為縱軸坐標即為行鸟妙。

?????? 如果我們想看到更多的地圖細節(jié)，可以使用不同的縮放層級來達到目的挥吵≈馗福縮放的層級越高，顯示細節(jié)也會相應增加忽匈。

? ? ? ?例如房午，當縮放層級為0時，整個地圖就是一張瓦片丹允，按照上文的描述郭厌，它的數(shù)學坐標就是0/0/0，這一張瓦片覆蓋了整個世界范圍雕蔽。如下圖所示：

? ? ? ?當縮放級別變?yōu)?時折柠，把縮放級別為0時的那張瓦片分割成四個相等的方塊，其中坐標為1/0/0和1/1/0的兩塊覆蓋北半球批狐，坐標為1/0/1和1/1/1的兩塊覆蓋南半球扇售。如下圖所示：

? ? ? ?由此可總結出如下規(guī)律：

地圖層級為0時，有一張瓦片嚣艇；地圖層級為1時承冰，有4張瓦片；地圖層級為2時食零，有16張瓦片困乒；也就是說當前層級的一張瓦片會在下一層級被分割為4張瓦片。即可由計算公式2^2n（其中n為層級）計算出一個層級下有多少張瓦片慌洪。如下圖所示：

? ? ? ?其實顶燕，在服務器環(huán)境下保存的瓦片圖片目錄結構也如下圖所示：

? ? ? ? 當我們在前端請求瓦片時，就是在找到這樣的目錄結構以致找到對應位置的瓦片圖片冈爹。

“?本期文章附帶源碼下載地址”

按照以上論述涌攻，附贈利用python爬取瓦片代碼：鏈接:http://pan.baidu.com/s/1jHDcYf8 ?

密碼:joj9

本文轉自微信公眾號:OpenGiser的文章