仇尚媛 周 浩 王 春 郝詠梅

（中國哈爾濱150090黑龍江省地震局）

地震數據地圖化動態(tài)顯示

仇尚媛 周 浩 王 春 郝詠梅

（中國哈爾濱150090黑龍江省地震局）

使用ASP和JQUIRY等語言，傳遞少量或大量后臺數據，快速推送到前臺地圖頁面，當鼠標掠過前臺顯示頁面內任意某個小圖片時，顯示其數據信息和相應大圖片。本文以地震系統(tǒng)應急避難場所數據和地震目錄數據為例，闡述地震數據動態(tài)地圖化頁面顯示的實現過程。

百度地圖API；地震應急避難場；ASPJSON；JQUIRY

0 引言

百度地圖API技術是一套由JavaScript語言編寫的應用程序接口，幫助在網站中構建功能豐富、交互性強的地圖應用。百度地圖技術對用戶具有強大的吸引力——靈活、快捷、方便、斷網少。據了解，地震系統(tǒng)當前只有廣東省地震局等少數單位應用百度地圖技術。

地震系統(tǒng)數據信息與地圖結合應用普遍，如震中圖動態(tài)顯示、地震烈度圖、地震應急場所位置及信息顯示等。地震數據格式種類較多，如地震目錄數據、地震避難場所數據、前兆分鐘值、小時值數據等，很多數據基于地圖顯示（趙曦等，2014），且地圖化動態(tài)顯示要求較高，如震中圖。一條地震目錄信息包含時間、地點（經緯度）、震級、精度等參數，如果將幾十條甚至上萬條信息同時標注在一幅地圖上，對前后臺數據處理能力要求較高，與單條數據處理方式不同（祝媛媛，2015）。綜合應用ASP（林風等，1999）、JSON、JQUIRY和Baidu Map技術（http://lbsyun.baidu.com/，2015），以地震避難場所數據和地震目錄數據為例（王海英等，2014），闡述具體實現過程，前者一次可地圖化顯示巨量數據，后者只對一條地震目錄信息進行圖形化顯示。

1 批量數據地圖化顯示

因防震減災工作要求，中國各省市縣均不同程度規(guī)劃建設或改建地震避難場所。黑龍江省地震避難場所約294處，將數據信息同時輸出到用戶頁面，有利于地震應急網上查詢及搜索工作的開展。以此為例，闡述地震信息批量數據的地圖化動態(tài)顯示。

1.1 處理過程

（1）構建地震避難場所信息表?；赟QL Server 2012建立后臺數據庫，建立Emergency_Shelter地震避難場所信息點數據庫表，設置字段和值，如："Objectid":1，"Area_ size":"28000.00000000000"，"Useage"："廣場"，"Category":"III"，"Area_name":"大興安嶺加格達奇區(qū)世紀廣場"，“PHOTO”：“m”。PHOTO字段為庫表里場地圖片位置，也可增加場地信息等內容，生成應急避難場所指示標志見圖1，用戶點擊信息窗會看到場地圖片及信息內容。

圖1 生成應急避難場所指示標志Fig.1 Generated indication of emergency shelter

（2）轉成JSON格式數據字符串。使用ASP（或其他語言，如PHP）讀取并生成符合JSON數據格式的字符串（或轉為對象），如生成大興安嶺加格達奇世紀廣場，代碼為

JSON數據可使用ASP JSON（http://code.google.com/p/aspjson/）自動生成，目前較新文件為JSON_2.0.4.asp。建立my_tojson.asp文件，增加以下語句

QueryToJSON（myconnjson，"select * from ［Emergency_ Shelter］"）.Flush

執(zhí)行my_tojson.asp文件，生成以下JSON格式數據。

［｛"Objectid":1，"Area_size":"28000.00000000000"，"Useage":"u5E7Fu573A"，"Category":"III"，"Area_ name":"u5927u5174u5B89u5CADu52A0u683Cu8FBEu5947u533Au4E16u7EAAu5E7F u573A"，"Area_Latitude":"50.42000000000"，"Area_Longitude":"124.14000000000"，"Area_remark":null｝，｛"Obj ectid":2，"Area_size":"17200.00000000000"，"Useage":"u516Cu56ED"，"Category":"III"，"Area_name":"u5927 u5174u5B89u5CADu52A0u683Cu8FBEu5947u533Au513Fu7AE5u516Cu56ED"，"Area_Latitude":"50.4 2300000000"，"Area_Longitude":"124.11300000000"，"Area_remark":null｝，......

（3）使用JSON對象生成百度地圖，具體過程為：①定義＜DIV＞元素作為創(chuàng)建地圖的容器，如adaiContent；②定義＜button＞類型作為命令啟動按鈕，如button；③頁面空載后，執(zhí)行命令按鈕，通過jQuery get（）方法加載my_tojson.asp文件，抓到服務器返回數據data，經jQuery eval（）函數轉換JSON字符（即偽對象），生成JSON格式的$jsondata_ obj對象，由$jsondata_obj對象獲得經緯度數據，定義覆蓋物類型，標注到地圖所在經緯度點上，其他數據可通過事件觸發(fā)由信息窗顯示。

批量地震數據地圖化顯示代碼（百度地圖API1.3開發(fā)指南）如下

JAVASCRIPT代碼主要結合jQuery和Baidu Map API完成。由于本文所用避難場點數據的經緯度值是GPS坐標，非Baidu坐標值，故使用BMapLib.MapWrapper類下的addOverlay（）方法實現標注。

對代碼進行斷點測試，可在map對象上添加一個click或其他事件的監(jiān)聽函數，點擊地圖上該位置，監(jiān)聽函數通過控制臺輸出當前點擊位置；沒有控制臺，可使用alert（）把point的lng和lat屬性或其他值輸出。

黑龍江省部分地震應急避難場（收集294處數據信息）顯示效果截圖見圖2。

圖2 黑龍江省部分地震應急避難場（294處）顯示效果Fig.2 Parts of earthquake emergency asylum field in Heilongjiang Province（294）display screenshot

1.2 技術問題

（1）文件中＜head＞與＜/head＞區(qū)間內，加載 代 碼＜script type="text/javascript" src="inc/ jquery-1.8.1.min.js"＞＜/script＞和 ＜script type="text/javascript" src="inc/MapWrapper.js"＞＜/script＞（本文使用1.8.1版本的jquery）。此處探討一個問題，當筆者把地圖尺寸放大至500 m時，發(fā)現標注點與信息窗口點位存在約1.5km距離，無論調錨點還是其他可調整處，二者間始終維持在此距離，不知何故？正常應該是同時變化。

（2）采用另一種實現方法，即每個點的要素循環(huán)生成所需標注及信息，但對瀏覽器而言，每個信息窗均顯示最后循環(huán)點位數據，而非各點自身數據，與javascript函數作用域有關，因為“click”事件或其他事件操作時才會觸發(fā)，而此時infoWindow已遍歷到最后一個對象。采用閉包原理可以解決以上問題，即在信息窗循環(huán)外加function（i） ｛//循環(huán)語句｝（i），但首先需將GPS坐標轉百度坐標。

（3）GPS坐標轉百度坐標。百度對外接口的坐標系非GPS采集的真實經緯度，本文場點坐標均由GPS設備采集，需要通過坐標轉換接口進行轉換，才能應用到百度地圖上。

2 單條數據地圖化顯示

單條地震目錄動態(tài)生成震中圖，相對簡單。部分代碼如下。

通過查詢處理程序（略）生成地震目錄頁面，見圖3。用戶點擊所需查看的地震目錄時，彈出相應地圖，顯示對應的可縮放震中圖及標注說明窗，見圖4。

圖3 地震目錄查詢結果Fig.3 Earthquake catalog query results

圖4 2014年1月8日四川省某地震震中位置Fig.4 A quake of Sichuan Province on Jan.8，2014

3 結束語

百度提供地圖API示例可供參考，但目前地震系統(tǒng)應用較少，查詢后臺數據庫的例子不多，本文對有此需求者提供ASP、JQUIRY實現思路，避免使用AJAX開發(fā)的繁雜。地震系統(tǒng)開發(fā)前景廣闊，Baidu Map API無疑給出具體解決方案。本文所討論的解決方法及實現模塊可集成到防震減災平臺網內，以滿足不同的地震業(yè)務要求。

林風，李維章，趙莉.動態(tài)網站設計捷徑---ASP［M］.西安電子科技大學出版社，1999.

王海英，等.地震后應急避難場所的運行管理［J］.防災科技學院學報，2014，16（12）：59-75.

趙曦，等.基于WebGIS的地震數據服務系統(tǒng)建設及關鍵技術研究［J］.災害學，2014，（3）：31-36.

祝媛媛.地震數據可視化技術的優(yōu)化研究與開發(fā)［J］.西部探礦工程，2015，27（4）：22-27.

Dynamic display based on map of seismic data

Qiu Shangyuan，Zhou Hao，Wang Chun and Hao Yongmei
（Earthquake Administration of Heilongjiang Province，Harbin 150090，China）

This article describes a specific program how to use ASP and JQUIRY and other languages to deliver a small amount or a large number of back-end data and quickly pushed to the foreground map page，and when the mouse passing front display within a page arbitrarily small pictures will show the thumbnail and the corresponding data representative of the large picture.In this paper，we use seismic system emergency shelters and earthquake catalog data for example describes the processes how to achieve dynamic mappable pages.

Baidu Map API，earthquake emergency shelter，ASPJSON，JQUIRY

10.3969/j.issn.1003-3246.2015.05.026

仇尚媛（1984—），女，黑龍江人，工程師，主要從事地震宣傳教育工作

地震科技星火計劃項目（XH1011Y）

本文收到日期：2015-03-12