廖夢怡，徐向藝

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

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

廖夢怡，徐向藝

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

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

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

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

1 系統(tǒng)功能

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

1）放大、縮小、拖動功能

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

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

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

3）綜合查詢功能

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

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

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

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

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

1）建立三維模型

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

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

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

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

3）縮放功能

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

on（release）{

_root.map_mc._xscale*=scale；

_root.map_mc._yscale*=scale；}

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

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

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

4）測距功能

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

測距功能函數(shù)

5）綜合查詢

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

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

6）導(dǎo)航功能

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

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

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

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

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

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

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

[3]馬向英，杜威登．基于圖像的室內(nèi)虛擬漫游系統(tǒng)[J].中國圖象圖形學(xué)報，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è)計與實現(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]胡小強.虛擬現(xiàn)實技術(shù)[M].北京：北京郵電大學(xué)出版社，2005.

[6]汪成為，高文，王行仁．靈境（虛擬現(xiàn)實）技術(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 稿件編號：201406060

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