馬 瑞

(中國電子科技集團(tuán)公司第三十三研究所，山西 太原 030006)

基于百度地圖API的空氣質(zhì)量指數(shù)發(fā)布系統(tǒng)的實(shí)現(xiàn)

馬 瑞

(中國電子科技集團(tuán)公司第三十三研究所，山西 太原 030006)

本文以太原地區(qū)空氣質(zhì)量日報數(shù)據(jù)為基礎(chǔ)，采用Asp.net、JavaScript以及SQL Server 等技術(shù)手段實(shí)現(xiàn)了基于百度地圖API的空氣質(zhì)量指數(shù)發(fā)布系統(tǒng)。該系統(tǒng)采用B/S結(jié)構(gòu)，不僅提供了電子地圖的基本功能，而且利用百度地圖API提供的區(qū)域著色功能對每一個縣區(qū)進(jìn)行著色。系統(tǒng)界面清晰直觀，用戶可以通過互聯(lián)網(wǎng)來進(jìn)行訪問，為公眾提供環(huán)境空氣質(zhì)量的日報信息。

百度地圖API；GIS；空氣質(zhì)量指數(shù)

隨著信息技術(shù)和網(wǎng)絡(luò)技術(shù)的飛速發(fā)展，地理信息技術(shù)也得到了發(fā)展和應(yīng)用，且在國土資源、環(huán)境保護(hù)以及公共安全等領(lǐng)域的作用也日漸突出。目前，國內(nèi)的很多GIS應(yīng)用都基于諸如SuperMap、ArcGIS等較為成熟的GIS平臺軟件，這些平臺軟件雖然技術(shù)成熟，但是建設(shè)周期長，實(shí)施過程復(fù)雜，而且購買以及維護(hù)成本很高。

本文介紹的空氣質(zhì)量指數(shù)發(fā)布系統(tǒng)基于開放的百度地圖服務(wù)，并利用百度地圖API進(jìn)行二次開發(fā)，實(shí)現(xiàn)了一個能夠依據(jù)標(biāo)準(zhǔn)[1]對各行政區(qū)域進(jìn)行著色，且更為直觀的空氣質(zhì)量指數(shù)發(fā)布系統(tǒng)。

1 百度地圖API

百度地圖API是為開發(fā)者免費(fèi)提供的一套基于百度地圖服務(wù)的應(yīng)用接口，通過地圖服務(wù)應(yīng)用接口將應(yīng)用開發(fā)平臺和地理信息數(shù)據(jù)捆綁，將復(fù)雜的地理信息系統(tǒng)底層進(jìn)行封裝，使用者可不必了解它的技術(shù)細(xì)節(jié)就能在應(yīng)用中快速構(gòu)建基礎(chǔ)地圖，并幫助使用者在Web系統(tǒng)中構(gòu)建功能豐富、交互性強(qiáng)的地圖應(yīng)用程序。百度地圖API不僅包含構(gòu)建電子地圖的基本功能接口，還提供了位置標(biāo)注、專題圖、區(qū)域著色、軌跡跟蹤等擴(kuò)展性功能服務(wù)，從地圖數(shù)據(jù)共享和功能共享兩方面簡化了GIS應(yīng)用，而且通過網(wǎng)頁腳本語言就可以將地圖服務(wù)嵌入到Web系統(tǒng)中。

2 系統(tǒng)架構(gòu)與實(shí)現(xiàn)

2.1 系統(tǒng)體系結(jié)構(gòu)

本系統(tǒng)采用B/S結(jié)構(gòu)，系統(tǒng)結(jié)構(gòu)如圖1[2]所示，用戶通過本地瀏覽器即可訪問該系統(tǒng)。Web服務(wù)器負(fù)責(zé)處理用戶的訪問請求，完成和業(yè)務(wù)數(shù)據(jù)庫、百度地圖服務(wù)的交互，服務(wù)端程序采用Asp.net技術(shù)和C#語言進(jìn)行開發(fā)；業(yè)務(wù)數(shù)據(jù)庫采用Sql Server數(shù)據(jù)庫管理系統(tǒng)存儲和管理；百度地圖服務(wù)通過百度地圖JavaScript API來實(shí)現(xiàn)。

圖1 系統(tǒng)結(jié)構(gòu)

2.2 地圖實(shí)現(xiàn)

百度地圖API采用JavaScript將百度地圖嵌入到應(yīng)用系統(tǒng)中，地圖數(shù)據(jù)和地圖服務(wù)的加載采用以下幾個步驟：

1) 加載地圖

通過下面的JavaScript引用載入百度地圖API，如下所示，本項(xiàng)目采用1.4版本[3]。

創(chuàng)建div容器來存放引入的地圖，并設(shè)置容器的樣式。

聲明一個地圖實(shí)例，以太原地區(qū)地理坐標(biāo)(112.556 198，37.870277)為中心，默認(rèn)為第10級。

var map = new BMap.Map(″map″);

map.centerAndZoom(new BMap.Point

(112.556198, 37.870277),10);

2) 設(shè)置電子地圖基本操作

◇ 設(shè)置導(dǎo)航控件，可以對地圖進(jìn)行縮放和平移

map.addControl(new BMap.NavigationControl());

◇ 設(shè)置鷹眼控件，可以顯示當(dāng)前地圖縮略圖

map.addControl(new BMap.OverviewMapControl());

◇ 設(shè)置比例尺控件，以及該控件在地圖上的位置

map.addControl(new BMap.ScaleControl());

map.addControl(new BMap.ScaleControl({off-set: new BMap.Size(1, 33),anchor: BMAP_ANCHOR_BOTTOM_RIGHT}));

◇ 設(shè)置地圖類型控件，可以在平面矢量圖、衛(wèi)星影像圖以及三維地圖三種類型間切換

map.addControl(new BMap.MapTypeControl());

◇ 設(shè)置鼠標(biāo)滾輪縮放功能

map.enableScrollWheelZoom();

3) 區(qū)域著色

利用百度地圖API中提供的方法getBoundary()獲取行政區(qū)域并對該區(qū)域著色。

◇ 獲取數(shù)據(jù)：利用Ajax技術(shù)以異步的方式從服務(wù)端獲取各行政區(qū)空氣質(zhì)量指數(shù)日報數(shù)據(jù)。

var htmlobj = $.ajax({ type: ″post″, url: ″ajax.asp″, async: true }); var info = htmlobj.responseText;

◇ 區(qū)域著色：根據(jù)《環(huán)境空氣質(zhì)量指數(shù)(AQI)技術(shù)規(guī)定 (HJ633-2012)》[1]，對獲取到的數(shù)據(jù)進(jìn)行地圖呈現(xiàn)，采用方法getBoundary()進(jìn)行區(qū)域著色，效果如圖2所示。

getBoundary(″小店區(qū)″,″#badcff″);

3 總結(jié)

本文闡述了基于百度地圖API的空氣質(zhì)量指數(shù)發(fā)布系統(tǒng)的設(shè)計與實(shí)現(xiàn)，該系統(tǒng)在服務(wù)端采用Asp.net技術(shù)獲取空氣質(zhì)量日報數(shù)據(jù)，在客戶端利用百度地圖API實(shí)現(xiàn)了太原地區(qū)十縣區(qū)空氣質(zhì)量日報指數(shù)的區(qū)域著色呈現(xiàn)，界面簡潔直觀，能更加有效地向公眾展示空氣質(zhì)量的狀況。

[1] 環(huán)境保護(hù)部.HJ 633-2012.環(huán)境空氣質(zhì)量指數(shù)(AQI)技術(shù)規(guī)定(試行)[S].北京：中國環(huán)境科學(xué)出版社，2012.

[2] 杜傳明.百度地圖API在小型地理信息系統(tǒng)中的應(yīng)用[J].測繪與空間地理信息，2011，(2):152-153.

[3] 百度地圖開放平臺[OL].2010-04-23[2016-12-20].http://lbsyun.baidu.com/index.php?title=jspopular,JavaScript API

[4] 白學(xué)文，楊紅，楊韜.基于百度地圖API發(fā)布鄉(xiāng)鎮(zhèn)精細(xì)化天氣預(yù)報[J].云南科技管理，2012(1):46-48.

Implementation of Air Quality Index Publish System Based on Baidu Map API

Ma Rui

(No.33ResearchInstituteofChinaElectronicsTechnologyGroupCorporation,TaiyuanShanxi030006,China)

In this paper, air quality index publish system is implemented based on Baidu Map API with using Asp.net, JavaScript and SQL Server technologies. The system which adopts B/S structure not only provides basic functions of electronic map, also puts colors on each of districts by using Baidu Map API. The system which is accessed through internet also has a convenient and intuitive interface, and provides information on Daily Report of Air Quality for the public.

Baidu Map API; GIS; air quality index

2016-12-30

馬 瑞(1981- )，男，工程師，研究方向：GIS。

1674- 4578(2017)02- 0056- 03

TP311.52

A