基于電子地圖的體育場館及周邊賓館接待能力的可視化系統設計

張峰筠，趙 靚，馮 璠

基于電子地圖的體育場館及周邊賓館接待能力的可視化系統設計

張峰筠1，趙 靚2，馮 璠1

通過對體育場館設施、周邊賓館及賓館的接待能力的調查與分析，利用Google Maps API進行基于電子地圖的體育場館及周邊賓館接待能力的可視化系統設計，在設計的系統中嵌入Google Maps，并在地圖上疊加自己的數據，實現體育場館及周邊賓館數據的標注、展示、疊加及統計等功能。

電子地圖；體育場館；賓館接待；可視化

1 研究的目的與意義

電子地圖綜合應用了數字制圖技術、地理信息技術、多媒體技術和數據庫技術，把各種媒體信息有機地聯結在一起，從根本上改變了傳統地圖單一的信息傳遞形式[1]，是現代地圖學發展方向，是數字制圖成果的主要表達形式[2]，也是地圖服務于社會經濟的重要手段，電子地圖的可視化效果是評價電子地圖產品或者系統的一個重要方面[3]。

另一方面，體育場館設施建設與接待條件是體育賽事項目資源條件的重要組成部分，是體育賽事申辦可行性判斷的重要標準之一。鑒于目前的電子地圖大多針對商用或公共服務所設計，沒有特定為體育場館及其周邊賓館接待能力而開發的成熟系統。通過對體育場館設施、周邊賓館及賓館的接待能力的調查與分析，并通過可視化方法將其在電子地圖系統中按需求進行查詢與顯示，可以將原先分散的數據與信息集中并直觀地進行表達，提高系統的操作性，為管理者的決策提供更加科學、形象和直觀的數據和信息，從而方便進一步對研究對象進行定性與定量的分析與研究[4]。

2 研究方法

以上海范圍內11家大型體育場館為主要研究對象，通過文獻資料法結合網絡查詢來設計體育場館與周邊賓館的數據結構，并對數據進行搜集與處理，構建相應數據庫，利用Google Maps API進行基于電子地圖的體育場館及周邊賓館接待能力的可視化系統設計，在設計的系統中嵌入Google Maps，并在地圖上疊加自己的數據，實現體育場館及周邊賓館數據的標注、展示、疊加及統計等功能[5]。

3 研究結果

3.1 研究內容

（1）通過調查獲取上海大型體育場館的有關信息，并構建“上海大型體育場館數據庫”，以供場館接待可視化系統的開發和查詢使用。

（2）通過調查獲取上海大型體育場館周邊賓館接待能力及分布情況，構建相應數據庫。

（3）對以上調查所得上海大型體育場館分布情況與周邊賓館分布情況，利用Google Maps API技術在地圖上進行標注，得到以場館為中心的包括周邊賓館的位置分布圖。

（4）對不同信息對象進行圖層疊加，實現以場館為中心按地理半徑進行查詢并分區顯示其周邊賓館的位置分布與接待能力。

3.2 數據的處理

運用Google Maps API進行體育場地的標注，關鍵的核心技術是要將體育場地進行空間化，即找到各體育場地在地球上的具體位置，用經緯度來標記，因此，需對每條記錄進行經緯度查詢。3.3 功能分析與實現

3.3.1 功能描述

（1）分區選擇體育場館

在系統中體育場館的選擇分兩步：①選擇區域；②選擇區域中的體育場館，如圖1。

圖1 體育場館的選擇Figure 1 Selection of Sports Facilities

本系統初定上海范圍內體育場館11家，分布于楊浦區、虹口區、長寧區、寶山區、盧灣區、徐匯區、嘉定區、閔行區和浦東新區。

（2）按條件篩選體育場館周邊的賓館

本系統可按“賓館星級”與“周邊范圍”2個條件選擇體育場館周邊的賓館，如圖2。

如圖2所示，“賓館星級”分為3星、4星和5星，可以多選；周邊范圍分為3 km、5 km和10 km，即可選擇體育場館周邊3 km（5 km、10 km）內的3星級（4星級、5星級）賓館，篩選結果如圖3。

如圖3所示，篩選結果以列表的形式、距離由近到遠展現，每一行顯示了2條賓館信息，即賓館名稱和賓館級別。

（3）體育場館及賓館的地圖可視化

a.體育場館的地圖可視化，如圖4。

圖4 體育場館地圖可視化Figure 4 Visualization of the Maps of Sports Facilities

如圖4所示，按區域選擇體育場館后，選擇的體育場館便可在地圖中標注顯示 ，單擊地圖中圖標，便可顯示場館的基本信息、場地信息和周邊交通信息。

b.周邊賓館的地圖可視化，如圖5。

按條件選擇體育場館周邊賓館后，篩選出的賓館可按位置在地圖中標注顯示

如圖5所示，由大到小的3個同心圓分別表示的是體育場館周邊范圍的10 km、5 km和3 km；園內的小圖標有3類：紅色小圖標代表的是5星級的賓館、黃色小圖標代表的是4星級的賓館、綠色小圖標代表的是3星級的賓館。

（4）統計分析

如圖6所示，統計分析中顯示的是選定體育場館周邊10km（5 km、3 km）范圍內3星級（4星級、5星級）賓館的數目和房間總數。

3.3.2 實現方法

（1）數據庫結構

本系統數據庫創建有2張表，分別是場館信息表（表1）和賓館信息表（表2）。

表1 場館信息（cgxx）表結構Table Ⅰ Information (cgxx) Table Composition of Sports Facilities

表2 賓館信息（bgxx）表結構Table Ⅱ Information (bgxx) Table Composition of Hotels

（2）地圖可視化的實現①Google Maps API 簡介

Google Maps API 是一種通過JavaScript將Google地圖嵌入到網頁的API，現有多個版本，本系統用的是Google Maps API V2，使用之前需要申請一個Google MAP API的key。

②頁面布局分析

在本系統中，頁面使用的是div布局：a.用于裝載查詢條件的div：

b.用于裝載體育場館查詢結果的div：

c.用于裝載賓館查詢結果的div：

d.用于裝載google地圖的div：

利用document.getElementById(“.”) 可得到需要的div對象，有value和length等屬性，例如，要想定位到地圖

div，則代碼為document.getElementById('map_canvas')。

③地圖的載入

a.加載Google地圖API：

b. 加載地圖

④體育場館、賓館的標注

a.創建自定義圖標

b.創建標記和信息窗口

⑤側邊欄的實現

（3）體育場館的選擇

“分區選擇體育場館”的實現是一個二級聯動下拉框，即根據區域的選擇動態賦予體育場館下拉框的值。

（4）按條件篩選賓館

a.周邊范圍（距離）的計算使用的公式

b.sql語句

[1]蘇仰娜.基于Flash+XML的多媒體電子教學地圖的設計[J].中國電化教育,2011,3(1):127.

[2]田景漢，尹振君.基于多媒體電子地圖系統的實驗室管理與教學[J].實驗室科學,2011,14(2):146.

[3]張躍，謝超.電子地圖可視化質量因素研究與實踐[J].測繪科學,2011,2(4):146.

[4]趙靚.對上海市楊浦區體育場地信息平臺及其空間分布的研究[D].上海：上海體育學院，2011.

[5]劉增寶.GIS 的空間關系表達及計算研究綜述[J].電腦知識與技術,2009,5(2):462.

(責任編輯：陳建萍)

Design of a Visual System of Sports Facilities and Reception Capacity of the Surrounding Hotels Based on Electronic Map

ZHANG Feng-yun, ZHAO Jing, FENG Fan
(Shanghai University of Sport Events Research Center, Shanghai 200438, China)

Through the survey and analysis of the sports facilities and the surrounding hotels and hotel reception capacity, the author, using Google Maps API, designed a visual system of sports facilities and the surrounding hotel reception capacity based on electronic map. Google Maps were inserted into the system. New data were added to the Map so as to realize the functions of data tagging, display, addition and statistics of sports facilities and the reception capacity of the surrounding hotels.

electronic map; sports facilities; hotel reception; visualization

G80-05

A

1006-1207(2012)03-0067-03

2012-03-29

上海市科委科研項目（09490503200）

張峰筠，女，講師。主要研究方向：體育信息管理.

1.上海體育學院 賽事研究中心，上海 200438；2. 上海威途體育咨詢有限公司，上海 200438