基于百度地圖API的快速制圖系統的設計與實現

夏 軍

(西華師范大學 國土資源學院，四川 南充 637002)

隨著電子信息化時代的到來，地圖在人們的日常工作和生活中的地位越來越重要。從戶外導航、位置查詢，到災害救援、建設規劃等，地圖服務于社會經濟發展的方方面面，為人們提供方便。隨著地圖服務需求的增加，對于各類地圖的制作顯得尤為重要。而傳統地圖制作方法[1-3]，需要專業的地圖制作軟件，如ArcGIS、ARC/INFO、MapGIS、MapInfo、AutoCAD等。對于這些專業GIS軟件，安裝和學習的門檻較高，往往需要專業人士操作。

隨著國內外地理信息產業的迅猛發展，網絡地理信息資源越來越豐富[4]。近些年，谷歌地圖、天地圖、百度地圖等的興起，讓人們可以通過網絡地圖API輕易獲取到豐富的地圖資源和服務應用[5]。利用這些免費的地圖資源制作各類專題地圖[6]、地形圖[7]、交通位置圖[8]、救災應急地圖[9-13]、導航地圖[14]、旅游地理信息系統[15-17]、衛星影像圖[18]以及其他公共服務系統[19-20]等的研究已有很多。在某些情況下，可能只需要一張簡單的地圖，傳統的方法一般是利用衛星遙感影像、行政區劃、道路、河流和地名等專題地圖，再通過專業GIS軟件制作成地圖，這種方法繁瑣復雜、效率低下，而且需要具有一定GIS專業知識的技術人員才能完成。那么研究開發一款操作簡單、不需要專業知識，并能夠快速成圖的軟件系統，無論從制圖效率、成本和實用性上來說都具有重要的意義和必要性。

本文在分析快速制圖系統功能需求基礎上，對地圖格網坐標值自動獲取算法進行研究和試驗，并采用C#編程語言，在Visual Studio 2010集成開發環境下，調用百度地圖API，設計并開發快速制圖系統。該軟件系統可以制作帶經緯網格、經緯度和用戶自定義標注的行政區劃圖、衛星影像圖和交通位置圖等，簡單美觀，適用于項目報告、PPT演示等文檔插圖、以及海報、廣告展板等。該制圖系統出圖快速、操作簡單，非專業人士也能輕松制圖。

1 系統需求和開發思路

對制圖系統的基本要求是簡單、快速，方便操作，具有部分用戶自定義功能，能夠在數分鐘之內制作出美觀的小幅地圖，基本功能如下：

1)地圖加載。百度地圖、衛星影像圖、道路(地名)，可選擇切換地圖類型；

2)地圖基本操作。鼠標和導航控件控制地圖移動、放大、縮小等；

3)繪圖。點、線、面、文字+地標，編輯圖形，刪除圖形；

4)測距。邊畫邊測路線長度；

5)搜索地名、搜行政區域邊界；

6)截圖；

7)設置出圖樣式，包括標題文字、圖框、經緯度網格線、顏色等；

8)輸出帶坐標網格圖像。

針對制圖系統的功能需求，在Visual Studio 2010集成開發環境下，選用C#編程語言，將C/S和B/S模式相結合，把地圖頁面嵌入到系統主窗體的WebBrowser控件，實現客戶端調用網絡地圖的功能。網絡地圖數據源選擇百度地圖，具有美觀簡潔、內容豐富和免費開源的API等特點。該制圖系統結構功能如圖1所示。

圖1 制圖系統功能結構圖

2 地圖平臺及實現算法

2.1百度地圖API

百度地圖[21]是百度提供的一項網絡地圖搜索服務，覆蓋了國內近400個城市、數千個區縣。在百度地圖里，用戶可以查詢街道、商場、樓盤的地理位置，也可以找到離用戶最近的所有餐館、學校、銀行、公園等。除了提供豐富的公交換乘、駕車導航等查詢功能，還為用戶提供最適合的路線規劃。不僅知道要找的地點在哪，還可以知道如何前往。同時，百度地圖還為用戶提供了完備的地圖功能(如搜索提示、視野內檢索、全屏、測距等)，便于更好的的使用地圖，便捷的找到所求。

百度地圖JavaScript API[22]是一套由JavaScript語言編寫的應用程序接口，可幫助您在網站中構建功能豐富、交互性強的地圖應用，支持PC端和移動端基于瀏覽器的地圖應用開發，且支持HTML5特性的地圖開發。另外，2014-01-09，極速版JavaScript API全新上線，此版本專門針對簡單功能的移動端瀏覽器開發提供。百度地圖API免費對外開放，自v1.5版本起，您需先申請密鑰(ak)才可使用，接口(除發送短信功能外)無使用次數限制。

2.2 坐標轉換方法

通過屏幕截圖，不僅可以獲得地圖圖片，還可以得到地圖圖片的4個頂點相對于屏幕左上角的像素坐標(pixelX, pixelY)，再調用百度地圖API的“map.pixelToPoint()”將像素坐標轉換為WGS84地理坐標系下的經緯度坐標，代碼(JavaScript)如下：

function pointXY2LngLat(pixelX, pixelY){

var lngLat = map.pixelToPoint({x: pixelX, y: pixelY});

return lngLat.lng+','+lngLat.lat;

}

2.3 網格線坐標算法

地圖格網繪制需要預先知道它的經緯度坐標值，合理的格網分布可以使地圖更加規范和實用。通過大量試驗，利用本算法可以實現格網經度值和緯度值的自動計算，得到優化合理的坐標值，算法思路如下：預先設定最小格網數目和格網經線間隔值數組，再根據截圖范圍的經度差值，計算出合適的經線格網間隔值，再將格網經線間隔值乘以k(k=1，2，3……)得到0～360°范圍內的格網經度值，而介于截圖范圍內的這些值就是經線網格的經度值，核心代碼(C#)如下：

ArrayList GridLonArr = new ArrayList(); //定義網格經線值數組(待求)

double DMapLon = MapLonMax -MapLonMin; //地圖范圍經度差值(已知)

double[] GridDLonArr = new double[] { 50, 40, 30, 20, 10, 5, 2, 1 }; //預先設定的網格經度間隔數組(自定義)

int GridLonMinCount = 3; //經線網格的最小條數(自定義)

for (int i = 0; i < GridDLonArr.Length; i++)

{

if (DMapLon / GridDLonArr[i] >= GridLonMinCount)

{

double GridLon = 0; //初始化經線網格經度值

int k = 0;

while (GridLon <= 360) //360為經度值上限

{

GridLon = GridDLonArr[i] * k; //計算所有經線網格值

if (GridLon >= MapLonMin && GridLon <= MapLonMax) //選取介于截圖范圍的經線網格

{

GridLonArr.Add(GridLon); //將得到的網格經度值添加到數組

}

k++;

}

}

}

該算法簡單、易于實現，運算速度快。格網緯度值計算方法與經度值相似，只是取值范圍不同，經度值是0～360°，而緯度值范圍為0～90°。

3 地圖功能實現

該系統實現了電子地圖的基本功能，主要包括：地圖顯示、縮放、平移、地圖類型切換、圖形繪制、距離測量、地名搜索和行政區劃邊界顯示等，并繼承了百度地圖簡潔美觀、易于操作的特點。地圖類型包括：行政區劃地圖、衛星影像圖和疊加了道路地名的衛星影像圖。圖形繪制包括：文字、地標、路線、多邊形、圓和矩形。

3.1 地圖加載

雖然百度API是免費開放的，但從v1.5版本后需要申請密匙。所以在滿足開發功能需求的前提下，選擇v1.4版本的API。創建名稱為“index.html”的html文件，通過百度地圖API加載百度地圖，代碼(Html、CSS和JavaScript)如下：

以上調用百度地圖API加載了地圖，具有地圖顯示、導航控制、地圖類型切換等功能。根據功能需求，還加入了繪圖工具、搜索和地圖制作工具等。在Visual Studio 2010中新建項目，新建窗體，創建WebBrowser控件，將“index.html”網頁加載進去，實現B/S和C/S模式相結合，制作成桌面版的網絡地圖。軟件運行的主界面如圖2所示。

圖2 制圖系統主界面

3.2 地名和行政區劃搜索

Geocoding API 是一類簡單的HTTP接口，用于提供從地址到經緯度坐標或者從經緯度坐標到地址的轉換服務。通過創建“new BMap.Geocoder()”實例可以實現對地名的搜索和定位，代碼(JavaScript)如下：

var geocoder = new BMap.Geocoder();

geocoder.getPoint(address, function(point){

//此處解析返回結果，獲得位置坐標

}

Boundary服務類可實現對行政區劃的搜索和邊界的顯示，該服務類只能搜索并顯示縣級或更高級別行政區域邊界，無法搜索鄉鎮和村的邊界。通過實例化對象“new BMap.Boundary()”可以返回行政區域邊界坐標，代碼(JavaScript)如下：

var boundary = new BMap.Boundary();

boundary.get(place, function(rs){

//此處解析返回結果，獲得邊界坐標

}

3.3 距離測量

距離測量功能使用百度地圖的“BMapLib.DistanceTool”類，它是一套基于百度地圖API二次開發的開源的代碼庫，對外開放。允許用戶在地圖上點擊完成距離的測量，可以自定義測距線段的相關樣式，例如線寬、顏色、測距結果所用的單位制等。該類基于Baidu Map API 1.2，主入口類是DistanceTool，通過實例化，即可調用該類提供的open 方法開啟測距狀態，代碼(JavaScript)如下：

var distance = new BMapLib.DistanceTool(map);

distance.open();

3.4 圖形繪制

圖形繪制功能采用百度地圖開源庫的“BMapLib.DrawingManager”類，提供鼠標繪制點、線、面、多邊形(矩形、圓)的編輯工具條。且用戶可使用JavaScript API對應覆蓋物(點、線、面等)類接口對其進行屬性(如顏色、線寬等)設置、編輯(如開啟線頂點編輯等)等功能。該類是基于Baidu Map API 1.4，實例化后，即可調用該類提供的open 方法開啟繪制模式狀態，還可加入工具欄進行選擇操作。實例化鼠標繪圖工具代碼(JavaScript)如下：

var drawingManager = new BMapLib.DrawingManager(map, {

isOpen: false, //默認不開啟繪制模式，用戶通過選擇繪圖工具開啟

circleOptions: styleOptions, //圓的樣式

polylineOptions: styleOptions, //線的樣式

polygonOptions: styleOptions, //多邊形的樣式

rectangleOptions: styleOptions //矩形的樣式

});

還可以加入鼠標監聽事件，對繪圖整個繪圖過程進行響應，如以下代碼(JavaScript)當繪圖完成時執行。

drawingManager.addEventListener(“overlaycomplete”, function(e){

//當繪圖完成時觸發該事件

}

4 地圖制作

4.1 地圖整飾

制作一張基本的地圖，需要添加一些地圖要素，包括：圖框、格網、標注、指南針、四周的文字、比例尺和圖例等，而它們的位置和樣式直接影響到地圖的美觀性。該系統可以快速制作簡單美觀的小幅地圖，可以自動生成地圖內外圖框、經緯網、經緯度標注、標題，并可以修改它們的顏色和線條粗細。地圖比例尺采用百度地圖默認的比例尺樣式，坐標系為WGS84，投影為Web墨卡托。制圖過程順序如下：地圖截圖→加內外圖框→加經緯網→加經緯度標注→加指北針→加標題→輸出地圖。

地圖整飾主要是調用C#的“Graphics”類，另外新建一個繪圖類“Draw”，將“Graphics”類的添加文字、圖形等功能封裝起來，方便調用。以下是“Draw”類的定義，具體代碼(C#)省略。

public class Draw

{

public void drawBorder(){ } //繪制地圖圖框

public void drawGrid(){ } //繪制經緯網格

public void drawLongitudeLatitude(){ } //繪制經緯度標注

public void drawNorthArrow(){ } //繪制指北針

public void drawTitle(){ } //繪制地圖標題

}

在以上方法中，地圖格網的繪制是難點，采用本文設計的格網坐標自動獲取算法，根據地圖經度和緯度跨度，結合地圖寬高像素值，合理計算需要繪制的經線和緯線條數以及它們在地圖上的位置。

4.2 制圖步驟

利用該制圖系統制作地圖非常簡單快速，操作步驟主要分3步：①調整地圖。選擇地圖源，放大、縮小地圖到合適比例尺，移動地圖到需要的范圍，調整比例尺到右下角位置，還可以對地圖進行文字和圖形標注；②截圖。點“截圖”按鈕，調整截圖窗口到合適位置，并可以對截圖進行文字和圖形的添加，雙擊鼠標左鍵完成截圖；③出圖。點“出圖”按鈕，系統自動制作地圖，以“Jpeg”圖片格式保存到出圖文件目錄下面，并自動打開圖像，方便進行瀏覽。

以四川省成都市為例，搜索行政區域名稱“四川省成都市”，系統自動獲取邊界坐標并繪制出紅色邊界；在地圖上進行“郫都區”和“都江堰景區”標注，利用測距工具標示出距離，從成都市三環路到郫都區直線距離為15.6 km，到都江堰景區距離為50.4 km；調整地圖窗口到合適位置，將地圖原有比例尺包含在內；點“截圖”按鈕，調整截圖范圍，如圖3所示；再點“出圖”按鈕，地圖制作成果如圖4所示。該制圖系統制作出的地圖默認上方向為正北方向。

圖3 截圖過程界面

圖4 地圖制作成果圖

5 結束語

日常生活和工作中經常會用到地圖，而地圖的制作需要相關的專業知識、龐大的GIS軟件和復雜的操作步驟。本文通過對快速制圖的需求分析，實現了地圖格網經度值和緯度值坐標的自動獲取算法，并以百度地圖作為地圖源，采用C#、JavaScript等編程語言進行開發，通過對百度地圖API進行調用，設計并開發了快速制圖系統。通過該制圖系統可以方便快速地制作出各類示意性地圖和專題圖，如：項目研究區、交通位置圖、行政區劃圖、旅游景點分布圖等的示意地圖。用戶可以自定義部分地圖樣式，包括：地圖圖框、經緯網格、地圖標題、經緯度標注等。制作出的地圖簡單美觀，適用于項目報告、PPT等文檔插圖，以及海報、廣告展板等，也可用于應急情況下的緊急制圖，服務于社會經濟生活。該制圖系統操作簡單，制圖效率高，使用者不需要地圖相關知識，也不需要復雜的GIS專業軟件，對制圖工作起到事半功倍的效果。

快速制圖系統在制圖方面的優勢，重在于快捷、簡單和美觀，無需專業軟件和專業知識，為非專業人士提供了一個簡單而快速的制圖途徑。但相比傳統專業GIS軟件，還存在一些不足，暫時無法制作大幅的高分辨率地圖，還不能自動生成圖例，不能導入已有數據，今后將不斷完善，輸出結果將支持更多格式。