基于AS和瓦片地圖的虛擬校園漫游導(dǎo)航系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)

廖夢(mèng)怡，徐向藝

（平頂山學(xué)院 河南 平頂山 467000）

基于AS和瓦片地圖的虛擬校園漫游導(dǎo)航系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)

廖夢(mèng)怡，徐向藝

（平頂山學(xué)院 河南 平頂山 467000）

虛擬校園漫游導(dǎo)航系統(tǒng)是通過在3D仿真模型中加入交互功能。用戶可以通過瀏覽器產(chǎn)生親臨現(xiàn)場(chǎng)的感覺，非常直觀地了解學(xué)校的人文環(huán)境和物理設(shè)施。當(dāng)下各高校都建立了自己的虛擬校園系統(tǒng)。本文以平頂山學(xué)院西校區(qū)為例，開發(fā)出了具有放大查看、縮小查看、導(dǎo)航、測(cè)距、綜合查詢、快速信息標(biāo)注等交互功能的虛擬校園漫游系統(tǒng)，獲得了滿意的效果。

AS；瓦片地圖技術(shù)；虛擬校園；漫游導(dǎo)航

隨著計(jì)算機(jī)技術(shù)和圖形圖像技術(shù)的快速發(fā)展，虛擬現(xiàn)實(shí)技術(shù)在日常生產(chǎn)、生活中體現(xiàn)出了重要地位，新的虛擬現(xiàn)實(shí)產(chǎn)品和虛擬體驗(yàn)方式也越來越多。虛擬校園漫游導(dǎo)航系統(tǒng)是虛擬現(xiàn)實(shí)技術(shù)在教育領(lǐng)域的應(yīng)用。用戶可通過瀏覽器查看校園中的虛擬場(chǎng)景，并進(jìn)行現(xiàn)場(chǎng)交互，從而使用戶可以方便、直觀地體驗(yàn)學(xué)校的各種設(shè)施和布局。虛擬校園將成為外界了解學(xué)校的一個(gè)窗口，對(duì)于展示學(xué)校整體形象將發(fā)揮不可替代的作用。該平臺(tái)不僅可以豐富校園網(wǎng)站建設(shè)，也可以用于校園規(guī)劃建設(shè)、環(huán)境展示，還可以用作教學(xué)案例，隨著系統(tǒng)功能的不斷完善也將促進(jìn)高校數(shù)字化進(jìn)程的發(fā)展[1]。

1 系統(tǒng)功能

虛擬校園漫游導(dǎo)航系統(tǒng)不但要給用戶提供三維仿真環(huán)境，也要實(shí)現(xiàn)校園相關(guān)信息的查詢和交互功能。具體有以下幾方面的功能要求：

1）放大、縮小、拖動(dòng)功能

用戶可以選擇使用滾動(dòng)鼠標(biāo)或者點(diǎn)擊界面上的相關(guān)圖標(biāo)來實(shí)現(xiàn)放大縮小，并用空格鍵實(shí)現(xiàn)地圖的任意拖動(dòng)，主要方便用戶細(xì)化觀看某處景觀和整體觀看校園全局景觀。

2）導(dǎo)航和測(cè)距功能

當(dāng)用戶使用地圖的過程中，若在某處對(duì)方向產(chǎn)生疑惑或者需要快速定位到某一地點(diǎn)時(shí)，就需要導(dǎo)航功能來實(shí)現(xiàn)，而測(cè)距功能是用戶通過點(diǎn)擊鼠標(biāo)左鍵對(duì)某兩點(diǎn)或多點(diǎn)測(cè)量真實(shí)距離，方便用戶查閱，從而快速獲取數(shù)據(jù)以及估算行程。

3）綜合查詢功能

當(dāng)用戶需要搜索某一場(chǎng)所或景觀，可在搜索框中輸入關(guān)鍵字或搜索類別，系統(tǒng)將智能查詢?yōu)g覽的位置，快速進(jìn)行定位。

4）快速信息標(biāo)注功能

用戶可以通過虛擬校園進(jìn)行多信息顯示和快速定位，如查找和定位ATM，超市，賓館，教學(xué)樓，實(shí)驗(yàn)樓，藝術(shù)等位置信息。

2 技術(shù)實(shí)現(xiàn)

虛擬校園漫游導(dǎo)航系統(tǒng)的實(shí)現(xiàn)，首先利用Maya建模軟件建立三維校園模型，經(jīng)過材質(zhì)貼圖和燈光效果，最終渲染出校園成品圖，然后借助Actionscript3.0語言和瓦片地圖技術(shù)實(shí)現(xiàn)放大、縮小、導(dǎo)航和測(cè)距、綜合查詢、快速信息標(biāo)注等功能。

1）建立三維模型

為了提高校園三維模型的仿真性，首先需要在谷歌衛(wèi)星地圖中截取校園的平面地圖和衛(wèi)星地圖，并且借助數(shù)碼相機(jī)搜集校園實(shí)景圖，將衛(wèi)星地圖導(dǎo)入到AUTO CAD2014中，繪制校園平面輪廓，然后使用global mapper軟件即可得到三維地形效果圖。并將平面圖導(dǎo)入Maya三維軟件中，制作校園建筑立體模型、景觀模型，并進(jìn)行材質(zhì)貼圖和添加燈光效果。技術(shù)路線圖如圖1所示。

圖1 3d建模技術(shù)路線圖Fig.1 3d modeling technology roadmap

2）地圖基本功能實(shí)現(xiàn)

地圖查詢是虛擬校園漫游導(dǎo)航系統(tǒng)的基本功能之一，包括有位置查詢和該位置屬性信息查詢［2］。位置查詢實(shí)現(xiàn)的方法是：首先將地圖中的面元素逐個(gè)轉(zhuǎn)成按鈕元件，并給每個(gè)按鈕元件按一定的規(guī)則編號(hào)。然后在Flash中加入用于地點(diǎn)查詢的Combobox組件，并將按鈕元件的序號(hào)與該Combobox組件的索引號(hào)對(duì)應(yīng)起來。這樣當(dāng)鼠標(biāo)移到按鈕上的時(shí)候，該區(qū)域就會(huì)變亮，當(dāng)用戶點(diǎn)擊該按鈕時(shí)，將會(huì)顯示出有關(guān)該區(qū)域的圖片、文字等信息，并且在Combobox組件中也會(huì)顯示出對(duì)應(yīng)地點(diǎn)或建筑的名稱。事先將整個(gè)校園地區(qū)建筑的介紹按照編碼規(guī)則對(duì)應(yīng)地寫入到XML中。然后通過調(diào)用ActionScript代碼連接到XML文件，最后從中讀取出所需要的相關(guān)信息，并顯示在信息介紹的文本框中。

3）縮放功能

虛擬校園漫游導(dǎo)航系統(tǒng)的縮放功能，主要是依靠按鈕元件on（release）來實(shí)現(xiàn)，每當(dāng)鼠標(biāo)點(diǎn)擊后，通過控制影片剪輯_xscale和_yscale的屬性來控制地圖的縮放比例，用戶通過點(diǎn)擊放大縮小來操作，其背后的原理是改變scale的數(shù)值變化來控制地圖的變化，當(dāng)scale數(shù)值大于1就放大地圖，反之亦然，用戶還可以通過滾動(dòng)來控制地圖的大小，原理相當(dāng)。系統(tǒng)中地圖縮放功能的部分主要代碼如下：

on（release）{

_root.map_mc._xscale*=scale；

_root.map_mc._yscale*=scale；}

但是地圖的放大不可能是無限的，因?yàn)榈貓D其實(shí)本是一張位圖，放大到一定程度地圖會(huì)變的模糊，出現(xiàn)所謂的馬賽克，此處使用瓦片地圖技術(shù)，就是類似于金子塔模式的原理，其原理是當(dāng)?shù)貓D放大到一定倍數(shù)時(shí)，高分辨率的、呈現(xiàn)細(xì)節(jié)更多的新地圖將會(huì)取代當(dāng)前低分辨率的地圖，而當(dāng)?shù)貓D縮小到一定倍數(shù)時(shí)，低分辨率的地圖將會(huì)取代高分辨率的地圖[3]。類似金子塔模式如圖2所示。

圖2 瓦片地圖技術(shù)原理示例圖Fig.2 The principle diagram of tile map technology

通過瓦片地圖技術(shù)將各分辨率的地圖轉(zhuǎn)換為相應(yīng)的影片剪輯，然后根據(jù)對(duì)_xscale數(shù)值的判斷，從而控制該影片剪輯的顯示或隱藏屬性，當(dāng)_xscale放大倍數(shù)大于200時(shí)，即將其_visible的屬性值設(shè)置為0，就隱藏該影片剪輯。

4）測(cè)距功能

測(cè)量功能就是用戶在交互三維地圖的時(shí)候，用戶可若想知道某兩地點(diǎn)現(xiàn)實(shí)距離[4]，就可以選用地圖的工具，測(cè)距工具。使用測(cè)距工具只需要在地圖上點(diǎn)擊任意兩點(diǎn)，系統(tǒng)便會(huì)在顯示框中顯示出這兩點(diǎn)的真實(shí)距離，主要開發(fā)過程是：首先添加一個(gè)名字為“量距”的按鈕，然后在按鈕中編寫相關(guān)代碼，基本原理主要是根據(jù)地圖與真實(shí)世界的比例，算出真實(shí)距離，這一功能大大增強(qiáng)了地圖的實(shí)用性，本系統(tǒng)中用戶可以在地圖中任意位置上按住鼠標(biāo)并拖曳出一條紅色直線，在直線上動(dòng)態(tài)顯示直線的長(zhǎng)度。以下是該功能的部分代碼

測(cè)距功能函數(shù)

5）綜合查詢

當(dāng)鼠標(biāo)移動(dòng)到系統(tǒng)功能查詢按鈕菜單欄，菜單按鈕會(huì)彈出一個(gè)菜單列表，用戶可以上下滑動(dòng)鼠標(biāo)選擇查詢菜單，當(dāng)系統(tǒng)查詢到該位置時(shí)，在主窗口中以閃爍模式顯示該對(duì)象，并在右下部分同時(shí)顯示該對(duì)象的圖形信息和文本信息。建立相應(yīng)的XML數(shù)據(jù)文件，保存動(dòng)態(tài)滾動(dòng)菜單信息，當(dāng)鼠標(biāo)選中某一菜單信息時(shí)，鏈接xm l文件中對(duì)應(yīng)的數(shù)據(jù)，使用loadMovie（）函數(shù)加載查詢結(jié)果[5]。

第二種查詢方式：關(guān)鍵字查詢，使用AS語言中 的Menu自帶組件，用戶在搜索文本框中錄入查詢目的地的關(guān)鍵詞，單擊搜索按紐，即可查看到搜索結(jié)果。此處采取數(shù)組匹配的方法，建立查詢關(guān)鍵字?jǐn)?shù)組和對(duì)應(yīng)的地物名稱數(shù)組var keywords:Array和var key-names:Array，使用for循環(huán)語句對(duì)關(guān)鍵字和地點(diǎn)進(jìn)行嵌套查詢。

6）導(dǎo)航功能

三維地圖中導(dǎo)航功能的實(shí)現(xiàn)為用戶提供方位、坐標(biāo)給用戶查看地圖是提供了方便，可以幫助用戶找到自己在全局中所在的位置，地圖導(dǎo)航功能也俗稱“鷹眼”。

它可以顯示出全地圖的整體概貌，并且顯示出用戶所瀏覽的當(dāng)前位置，更加好用的功能是當(dāng)瀏覽者移動(dòng)導(dǎo)航窗口中定位點(diǎn)，或者點(diǎn)擊導(dǎo)航圖中的某一位置時(shí)，主窗口也會(huì)同步顯示所選中區(qū)域的地理景觀，從而實(shí)現(xiàn)電子地圖的快速定位和瀏覽，方便用戶快速查詢到要到的區(qū)域。

本系統(tǒng)中鷹眼功能的核心代碼：

3 技術(shù)應(yīng)用實(shí)例

應(yīng)用Actionscript語言和瓦片地圖技術(shù)，結(jié)合Maya三維軟件開發(fā)了平頂山學(xué)院虛擬校園漫游導(dǎo)航系統(tǒng)。利用該系統(tǒng)實(shí)現(xiàn)了對(duì)平頂山學(xué)院校園的三維建模，并實(shí)現(xiàn)了該虛擬校園的放大查看、縮小查看、導(dǎo)航、測(cè)距、綜合查詢、快速信息標(biāo)注等功能。平頂山學(xué)院虛擬校園漫游導(dǎo)航系統(tǒng)首頁如圖3所示。

圖3 平頂山學(xué)院虛擬校園漫游導(dǎo)航系統(tǒng)首頁Fig.3 Virtual campus roamingnavigation system of Pingdingshan university

4 結(jié)束語

本文介紹了虛擬校園漫游導(dǎo)航系統(tǒng)的設(shè)計(jì)目標(biāo)及實(shí)現(xiàn)方法，并以平頂山學(xué)院西校區(qū)為實(shí)際場(chǎng)景，使用Maya進(jìn)行三維建模，獲得了逼真的虛擬效果。借助Actionscript語言和瓦片地圖技術(shù)，實(shí)現(xiàn)了放大查看、縮小查看、導(dǎo)航、測(cè)距、綜合查詢、快速信息標(biāo)注等交互功能。該項(xiàng)技術(shù)和實(shí)現(xiàn)方法必將在校園地理生活信息，數(shù)字城市建設(shè)，電子政務(wù)信息服務(wù)，城市規(guī)劃或設(shè)計(jì)等方面獲得越來越多的關(guān)注和應(yīng)用。

[1]張德義.基于Web的三維虛擬校園系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)[M].北京：清華大學(xué)出版社，2008.

[2]陳彥菲.校園內(nèi)場(chǎng)景的虛擬漫游技術(shù)研究[D].大連：大連理工大學(xué)，2008.

[3]馬向英，杜威登．基于圖像的室內(nèi)虛擬漫游系統(tǒng)[J].中國(guó)圖象圖形學(xué)報(bào)，2009，6（A）：87-90．MA Xiang-ying，DU Wei-deng.Indoor virtual walkthrough system based on image[J].Chinese Journal of Image and Graphics，2009，6（A）：87-90.

[4]吳丹，陳春來，張洪珍.虛擬華東師范大學(xué)系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)[J].電腦開發(fā)與應(yīng)用，2006（4）：17-19. WU Dan，ZHANG Chun-lai，ZHANG Hong-zhen.Design and realization of virtual east china normal university[J]. Development and Application of Computer，2006（4）：17-19.

[5]胡小強(qiáng).虛擬現(xiàn)實(shí)技術(shù)[M].北京：北京郵電大學(xué)出版社，2005.

[6]汪成為，高文，王行仁．靈境（虛擬現(xiàn)實(shí)）技術(shù)的理論、實(shí)現(xiàn)及應(yīng)用[M]．北京：清華大學(xué)出版社，2007．

Design and im p lementation of virtual cam pus based on AS and tile m ap

LIAO Meng-yi，XU Xiang-yi
（Pingdingshan University，Pingdingshan 467000，China）

The roaming navigation system about virtual campus add the interactive function in the 3D simulation model.The user can produce at the scene feeling through the browser，and learning humanistic environment and physicalfacilities.The paper introduction west campus of pingdingshan university，and develop a virtual campus roaming system.The system has enlarged view，narrow view，navigation，location，comprehensive query，fast informationmark interaction function.

AS；tile map technology；the virtual campus；romimg navigation

TN319

A

1674－6236（2015）07-0145-03

2014-06-09 稿件編號(hào)：201406060

廖夢(mèng)怡（1983—），女，河南南陽人，碩士，講師。研究方向：虛擬現(xiàn)實(shí)技術(shù)。