計(jì)算機(jī)畢業(yè)設(shè)計(jì)外文翻譯--基于webgis的校園三維電子地圖的設(shè)計(jì)與實(shí)現(xiàn)

1、<p><b>　　（</b></p><p>　　二 〇 一 三 年 六 月</p><p>　　The Design and Implementation of 3D Electronic Map of Campus Based on WEBGIS</p><p>　　I. INTRODUCTION</p><

2、p>　　Nowadays, digitalization and informatization are the theme of our times. With the development of information revolution and computer science, computer technology has penetrated into all fields of science and cause

3、d many revolutionary changes in these subjects, the ancient cartography also can't escape. With the technical and cultural constantly progress, the form and the content of the map change and update as well. As the co

4、mputer graphics, geographic information systems (GIS) constantly applie</p><p>　　II. FUNCTIONDESIGN</p><p>　　Three-dimensional electronic map system of campus based on WEBGIS has general charact

5、eristics of the common maps. Through pressing the arrow keys (Up, Down, Left, And Right) on the keyboard, one can make the map move towards the corresponding direction of translation. Through dragging mouse, one can see

6、wherever he likes. Using the mouse wheel, you can control a map's magnitude, according to the user's needs to view different levels of map. The lower left of the map where will display the curren</p><p

7、>　　Major functions:</p><p>　　User information management: Check the user name and password, set level certification depending on the permissions, allow users of different permissions to login the system v

8、ia the Internet. </p><p>　　The inquiry of Location information: System can provide users with fuzzy inquires and quick location. </p><p>　　Map management: Implement loading maps, map inquires, l

9、ayer management, and other common operations such as distance measurement, and maps zoom, eagle eye, labels, printing, and more. </p><p>　　Roam the map: Use the up and down keys to roam any area of the map,

10、or drag-and-drop directly.</p><p>　　III. THE PROCESS OF SYSTEM DEVELOPMENT</p><p>　　To the first, we collect the information which contains the outward appearance of architectural buildings, the

11、 shape of the trees the design of the roads. And then, we construct three dimensional scenes with 3DS MAX software [2]. That is to say we render the scene and achieve the high-defmition map, after that we cut the map int

12、o small pictures with the cut figure program, at last we built the html pages which can asynchronous load maps and achieve the function of the electronic maps. The flow c</p><p>　　Figure 1 system development

13、 flow chart</p><p>　　Traditional maps have strict requirements on mathematical laws, map symbols and cartographic generalization when in design. The production of network landscape electronic map also has it

14、s own technical standards which is superior to the traditional map. The three-dimensional electronic map has different zoom levels; therefore it needs not the strict scale but the unified production standards. Map symbol

15、 usually imitate the real world as much as possible and simplify itself at the same time. The </p><p>　　As for the data acquisition and management, such as the introduction and the information users obtained

16、 from the map are final results of data acquisition. In the beginning, we collect the needed data including the name, the address, the introduction and the digital photos of the buildings and prepare for the subsequent t

17、hree-dimensional modeling. After collecting the data, we should pay attention to archival and backup the files in case of loss. </p><p>　　In order to get the map, a good preparation of the design of the stan

18、dard scene is necessary. We set the parameter of the underlay, lights, altitudes, render effects and so on, so as to ensure the final fruit of our effort will have a uniform effect. The spatial entity's performances

19、usually show up as the form of spot, line and surface in the three-dimensional electronic map. </p><p>　　Compared with vector graphics, the grid graphics have unparalleled advantages. The combination of the

20、grid graphics and the WEBGIS's background publishing technology can improve the response speed of system and save system's inputs. System achieves the interaction with the map with the JavaScript languages. Seein

21、g that there lie differences in supporting the scripting languages on various browsers, testing all kinds of functions by different browsers is a crucial step.</p><p>　　IV. KEY TECHNOLOGIES</p><p&

22、gt;　　The developments of three-dimensional electronic maps are inseparable with the development of related areas, and it learns research methods, techniques and tools from other areas. While the researches of other areas

23、 are directly applied to the development and construction of three - dimensional electronic map, and Computer graphics, 3-D GIS, Virtual Reality and Geographic Data Base, the modeling of virtual scene and so became the t

24、echnical support of the three-dimensional electronic map system. </p><p>　　The WEBGIS technology on which three-dimensional electronic map system of campus based is a standard Software technology which means

25、 without any commercial software's support. During the development of the system we make use of the common available technology which includes the JavaScript technology, Ajax technology, XML technology, etc. </p&g

26、t;<p>　　Ajax is not a one fold technology, it is a mixture which mixes multiple technologies together, including the document object which used to display on the web and its hierarchical structure document object

27、model DOM, and CSS that used to define the elements of style, and data exchange format XML or JSON, implementation and asynchronous server of XMLHttpRequest and client script language JavaScript [3]. Ajax takes advantage

28、 of non-synchronous interaction technology which means there is no need to </p><p>　　EXT is an excellent Ajax framework written in JavaScript; it has nothing to do with the back-end technology and can be use

29、d to develop rich client applications with a gorgeous appearance. The system enables the EXT combined with JSP to achieve the other page functions of the electronic map. The system combines the EXT with the Prototype who

30、se framework bears the burden of creating a rich client and a highly interactive Web application, which realizes the application of the rich client efficientl</p><p>　　JavaScript is the principle technology

31、of the system during the design and the implementation process. It allows a variety of tasks which can be completed solely on the client, and without the participation of the network and server which used to support the

32、distributed computing and processing, and therefore reducing the invisible waste of resources. JavaScript allows neither the access to the local hard disk, nor the data to be saved to the server, let alone to modify and

33、delete network docume</p><p>　　In this system, we take advantage of JavaScript scripting language to realize the key functions such as loading maps, zooming maps, geographic location, and other related auxil

34、iary functions, i.e. map icon display, ranging, eagle eye, tags. Oracle database meets the need of the data which is used in backstage management, and together with the JSP, XML and HTML to realize the user's authent

35、ication as well as adding, deleting, revising and inquiring information’s, etc. </p><p>　　The main function of the system is to realize the three dimensional electronic map displayed in the browser through W

36、EBGIS technology. Owing to the combination of JavaScript technology and WEBGIS development model, we can reduce the cost of the system, and at the same time improve the interoperability and system performance. Thanks to

37、the application of AJAX technology, we can make further improvement on loading dynamical map. All the technologies we use will reduce the reaction time, which will</p><p>　　V. THE IMPLEMENTATION OF THE SYSTE

38、M</p><p>　　A. The fabrication of the three-dimensional scene and scene rendering for map.</p><p>　　The three-dimensional electronic map of campus based on WEBGIS, is an electronic map system whi

39、ch takes the Northeast Petroleum University as the prototype. To realize this system, we should complete the fabrication of three dimensional scene and scene rendering for map, so we select 3DMAX whose operation is simpl

40、e and flexible to model. Given the later needs of electronic map, the three-dimension model should be delicate as much as possible. The three dimensional model's construction would take</p><p>　　To compl

41、ete the three-dimensional scene we should first prepare to render the scene well. Actually the grid picture which three dimensional electronic map used is the fixed angle of view swivel eye grid map. After modeling of th

42、ree dimensional spatial entities, select the appropriate rendering method and make a fixed camera angle positioning in the render (Normally at 45-degree angle ), and then set the render output parameters to render them i

43、nto the camera from the perspective of fixed size pi</p><p>　　B. Loading Map </p><p>　　In the WEB, the maps are mainly shown through the Div layer which has three layers. One layer is used as a

44、window the carrier of the map. The size of the layer is as large as the map which we usually see through the browser (referred to as the window layer). Another layer is the moving layer used to follow the drag of the mou

45、se (referred to as the moving layer).The other is the covering layer which lies between the window layer and the moving layer. The map window operated by users is constitute</p><p>　　When loading map, we use

46、 the raster data which we usually call image data. Raster data includes image data, two dimensional map, and three-dimensional simulated electronic map. The raster data in this system is three-dimensional simulated elect

47、ronic map. The abstract two-dimensional map makes some ordinary users difficult to learn the information they need, but the three-dimensional simulated map simulate the real world's information exactly, so users can

48、easily see the real world. This system m</p><p>　　C. The Basic Function of Map </p><p>　　Dragging, zooming and translation are the basic functions of the map, and they are also important feature

49、s of the map that differ from a simple picture. The following is a brief description of the implementation method. To realize dragging, the first thing is to set the mouse event functions. The events include mouse down a

50、nd mouse up. So the two functions combined can complete the map navigation. The mouse down event is mainly used to record the drag state as well as the present location, while</p><p>　　Gain ratio value befor

51、e amplification and the proper ratio value needed to enlarge. </p><p>　　Calculate the coordinates of the center of the map after amplification. The formula: (point.x / oldpercent) * newpercent. </p>&

52、lt;p>　　Modify icon data in the icon layer (Icon layer logical operation-Cmap _ Base.js). </p><p>　　Remove the current map layer, and force the memory recycling. </p><p>　　Load required map fi

53、le. </p><p>　　With these basic functions, the user can observe the entire campus buildings concisely and clearly. The map is divided into five zoom levels, users can zoom out to view more buildings, also can

54、 zoom in to examine the architectural details.</p><p>　　D. Other Utility Functions </p><p>　　Highlight and pop-up boxes </p><p>　　For some hot-query buildings, we use JSON data to c

55、reate a div layer, filled with color, and then set to translucent, when the mouse moved to the layer, this area will be highlight selected. When Mouse clicks on the highlighted area, a small window will pop up showing th

56、e architectural details. Take the stadium as an example, when the mouse is not over the stadium, the building has no change, but when moving the mouse over the stadium, the outline of the building shows. When click the h

57、ighlight </p><p><b>　　Range </b></p><p>　　As a result of mutual conversion between longitude and latitude and the campus electronic map coordinate, we can first transform campus elec

58、tronic map coordinate to the latitude and longitude coordinate, then calculate the distances between two spots through their latitude and longitude coordinates, this way is simple and precise. </p><p>　　Labe

59、l display and hide </p><p>　　In order to prompt some key places in the map (such as public transportation station, street sign ), using the new layer in its label tagging, it is convenient to the user for re

60、cognize specific location, but the tagging information will affect the whole scene showing, so the user can choose displaying labels when in needed. </p><p>　　Real-time coordinate and eagle-eyed </p>

61、<p>　　Through the eagle eye map which located on the bottom right comer of the electronic map, users can understand roughly where they are in the campus. Drag the green box in the eagle eye map can quickly locate to

62、 the site you want to. The left bottom area displays real-time coordinate value of the mouse cursor in the system. </p><p>　　Inquiry and localization function </p><p>　　The final designed system

63、 is easy to operate .It provides quick navigation to the home page. If you select certain types of buildings, it will list all the similar constructions on the right. Click on a building name can be fast locating the cor

64、responding position and display information’s related to the building. The inquiry data saved in the oracle relational database, while the positioning coordinate values picked up from the JSON files. The inquiry and loca

65、lization is connected through the s</p><p>　　VI. CONCLUSION</p><p>　　The three-dimensional electronic map of campus based on WEBGIS combines the advantages of macroscopically quality, integrity,

66、 and simplicity of 2d electronic map with reality, richness and intuitive of 3D virtual scene [6]. The map system using the JavaScript technology, the XML technology, the Oracle database and other technologies realizes t

67、he information transmission and interactive operation. The system itself is cross-platform, page-friendly, security, and easy to maintain, and B/S model al</p><p>　　From: YiZhi-An，Yin Liang-Qun．The Design an

68、d Implementation of 3D Electronic Map of Campus Based on WEBGIS．IEEE Conference Publications ．2012： 577-580</p><p>　　基于WebGIS的校園三維電子地圖的設(shè)計(jì)與實(shí)現(xiàn)</p><p><b>　　一．導(dǎo)言</b></p><p>

69、　　如今，數(shù)字化和信息化是當(dāng)今時(shí)代的主題。隨著信息革命和計(jì)算機(jī)科學(xué)的發(fā)展，計(jì)算機(jī)技術(shù)已經(jīng)滲透到科學(xué)的各個(gè)領(lǐng)域，并引起了許多革命性的變化，在這些科目，古代制圖學(xué)也不例外。隨著技術(shù)和文化的不斷進(jìn)步，地圖變化的形式和內(nèi)容也隨之更新。在計(jì)算機(jī)圖形學(xué)中，地理信息系統(tǒng)（GIS）不斷應(yīng)用到Web，制作和演示的傳統(tǒng)方式經(jīng)歷了巨大的變化，由于先進(jìn)的信息技術(shù)的發(fā)展，地圖的應(yīng)用已經(jīng)大大延長(zhǎng)。在這些情況下，繪圖將面臨廣闊的發(fā)展前景。電子地圖是隨之應(yīng)運(yùn)而生的產(chǎn)品

70、之一。隨著計(jì)算機(jī)技術(shù)，計(jì)算機(jī)圖形學(xué)理論，遙感技術(shù)，航空攝影測(cè)量技術(shù)和其他相關(guān)技術(shù)的飛速發(fā)展。用戶需要的三維可視化，動(dòng)態(tài)的交互性和展示自己的各種地理相關(guān)的數(shù)據(jù)處理和分析，如此多的關(guān)注應(yīng)支付的研究三維地圖。東北石油大學(xué)及其周邊地區(qū)的基礎(chǔ)上本文設(shè)計(jì)并建立三維電子地圖。</p><p><b>　　二．系統(tǒng)設(shè)計(jì)</b></p><p>　　基于WebGIS的校園三維電子地圖系

71、統(tǒng)的具有普通地圖的一般特性。通過(guò)按鍵盤(pán)上的箭頭鍵（上，下，左，右），可以使地圖向相應(yīng)的方向移動(dòng)。通過(guò)拖動(dòng)鼠標(biāo)，可以查看感興趣的任何一個(gè)地方。使用鼠標(biāo)滾輪，可以控制地圖的大小，根據(jù)用戶的需求來(lái)查看不同縮放級(jí)別的地圖。在地圖的左下角會(huì)顯示當(dāng)前鼠標(biāo)的坐標(biāo)。在一個(gè)div層，我們描繪了一個(gè)新建筑物的熱點(diǎn)，這層可以根據(jù)不同的地圖圖層的顯示，它也可以自動(dòng)調(diào)整。通過(guò)點(diǎn)擊熱點(diǎn)，它可以顯示熱點(diǎn)的具體信息。也可以輸入到查詢的信息，根據(jù)自己的需要，并得到一些相

72、關(guān)的信息。此外，通過(guò)點(diǎn)擊鼠標(biāo)，人們可以選擇檢查的三維地圖和衛(wèi)星地圖。</p><p><b>　　主要功能包括：</b></p><p>　　用戶信息管理：檢查用戶名和密碼，根據(jù)權(quán)限設(shè)置級(jí)別的認(rèn)證，允許不同權(quán)限的用戶通過(guò)互聯(lián)網(wǎng)登錄系統(tǒng)。</p><p>　　位置信息查詢：系統(tǒng)可以為用戶提供模糊查詢和快速定位。</p><p&

73、gt;　　地圖管理：實(shí)現(xiàn)加載地圖，地圖查詢，圖層管理，以及其他常見(jiàn)的操作，例如距離測(cè)量和地圖放大，縮小，鷹眼，標(biāo)簽，印刷等等。</p><p>　　漫游地圖：使用向上和向下鍵漫游的任何區(qū)域的地圖，或拖動(dòng)和拖放直接。</p><p><b>　　三．系統(tǒng)開(kāi)發(fā)過(guò)程</b></p><p>　　首先，我們收集了包含建筑外觀的信息，并對(duì)道路設(shè)計(jì)了樹(shù)的形

74、狀。然后，我們建立的三維場(chǎng)景與3DS MAX的軟件。通過(guò)這種方式我們渲染場(chǎng)景，并實(shí)現(xiàn)高清晰度的地圖之后，我們用切割圖形程序?qū)⒌貓D切割成小圖片，最后我們建立HTML頁(yè)面，它可以異步加載地圖，并實(shí)現(xiàn)了電子地圖的功能。該系統(tǒng)開(kāi)發(fā)的流程圖將圖1所示。</p><p>　　圖1 系統(tǒng)開(kāi)發(fā)流程圖</p><p>　　傳統(tǒng)的地圖在設(shè)計(jì)時(shí)對(duì)數(shù)學(xué)規(guī)律、地圖符號(hào)和制圖綜合都有嚴(yán)格的要求。網(wǎng)絡(luò)景觀電子地圖的制作

75、也有它自己的技術(shù)標(biāo)準(zhǔn)，這是優(yōu)于傳統(tǒng)地圖的。三維電子地圖有不同縮放級(jí)別；因此，它并不需要嚴(yán)格的規(guī)模，但需要統(tǒng)一的生產(chǎn)標(biāo)準(zhǔn)。地圖符號(hào)通常盡可能地模仿真實(shí)世界，并盡可能的簡(jiǎn)單化。屏幕的范圍遠(yuǎn)遠(yuǎn)大于紙質(zhì)地圖的固定視覺(jué)。制圖概括重視抽象模型和實(shí)際的性能結(jié)果之間的平衡。</p><p>　　作為數(shù)據(jù)采集和管理，如引進(jìn)用戶索取地圖信息是數(shù)據(jù)采集的最后結(jié)果。一開(kāi)始，我們收集所需的數(shù)據(jù)，包括名稱、 地址、 介紹和建筑物的數(shù)碼照片，

76、并準(zhǔn)備后續(xù)的三維建模。收集的數(shù)據(jù)后，我們應(yīng)該注意存檔和備份文件，以防丟失的文件。</p><p>　　為了生成地圖，配制好的標(biāo)準(zhǔn)場(chǎng)景設(shè)計(jì)是必要的。我們?cè)O(shè)置的參數(shù)包括：墊、 燈、 海拔高度、 渲染效果等等，以確保我們努力的成果最后具有均勻的效果?？臻g實(shí)體的表現(xiàn)通常以點(diǎn)、 線、 面的形式顯示在三維電子地圖。</p><p>　　與矢量圖形相比，網(wǎng)格圖形具有無(wú)可比擬的優(yōu)勢(shì)。網(wǎng)格圖形和WebGIS

77、的背景出版技術(shù)的組合，可以提高系統(tǒng)的響應(yīng)速度和節(jié)省系統(tǒng)的輸入。系統(tǒng)通過(guò)JavaScript 語(yǔ)言實(shí)現(xiàn)了地圖的交互。各種瀏覽器支持的腳本語(yǔ)言的支持存在差異，所以在不同的瀏覽器測(cè)試地圖的各個(gè)功能是不可缺少的步驟。</p><p><b>　　四．關(guān)鍵技術(shù)</b></p><p>　　三維電子地圖的發(fā)展與相關(guān)領(lǐng)域的發(fā)展分不開(kāi)的，并且借鑒了其他領(lǐng)域的的研究方法，技術(shù)和工具。而

78、其其他領(lǐng)域的研究直接應(yīng)用到了三維電子地圖的開(kāi)發(fā)和建設(shè)，計(jì)算機(jī)圖形學(xué)，三維GIS，虛擬現(xiàn)實(shí)和地理數(shù)據(jù)基礎(chǔ)，虛擬場(chǎng)景的建模，并因此成為三維電子地圖系統(tǒng)的技術(shù)支持。</p><p>　　校園三維電子地圖系統(tǒng)是基于WebGIS技術(shù)的一個(gè)標(biāo)準(zhǔn)的軟件技術(shù)，這意味著沒(méi)有任何商業(yè)軟件的支持。本系統(tǒng)的開(kāi)發(fā)利用常見(jiàn)的現(xiàn)有技術(shù)包括JavaScript技術(shù)，Ajax技術(shù)，XML技術(shù)等等。</p><p>　　Aj

79、ax是一種開(kāi)源的技術(shù)，它是一個(gè)將多種技術(shù)混合在一起，包括文檔對(duì)象的網(wǎng)頁(yè)顯示，層次結(jié)構(gòu)的DOM文檔對(duì)象模型和用來(lái)定義風(fēng)格元素的CSS，和數(shù)據(jù)交換格式的XML或JSON，實(shí)現(xiàn)和XMLHttpRequest異步服務(wù)器請(qǐng)求的JavaScript客戶端腳本語(yǔ)言。Ajax的利用非同步的交互技術(shù)，這意味著沒(méi)有必要刷新全部的頁(yè)面，因此，它減輕了用戶的等待時(shí)間。這就是它為什么會(huì)更容易被大眾所接受的原因。</p><p>　　EXT

80、是用JavaScript編寫(xiě)的優(yōu)秀Ajax開(kāi)源框架；它與后端技術(shù)無(wú)關(guān)，可以用來(lái)開(kāi)發(fā)一個(gè)華麗的外觀富客戶端應(yīng)用程序。該系統(tǒng)使EXT結(jié)合JSP實(shí)現(xiàn)的其頁(yè)面電子地圖功能。該系統(tǒng)結(jié)合了EXT原型框架，創(chuàng)造一個(gè)豐富的客戶端和高度交互的Web應(yīng)用程序，有效地實(shí)現(xiàn)富客戶端的應(yīng)用程序，并可以在一個(gè)安全控制的方式管理客戶端的安全。</p><p>　　JavaScript 是系統(tǒng)在設(shè)計(jì)和實(shí)施過(guò)程中的原理技術(shù)。它允許僅在客戶機(jī)上，就

81、可以完成各種各樣的任務(wù)，不需要網(wǎng)絡(luò)服務(wù)器的參與，用于支持分布式計(jì)算和處理，因此減少了不必要的資源浪費(fèi)。JavaScript既不允許訪問(wèn)本地硬盤(pán)，也不能數(shù)據(jù)將數(shù)據(jù)到服務(wù)器，更不用說(shuō)修改和刪除網(wǎng)絡(luò)文件。瀏覽網(wǎng)頁(yè)信息并實(shí)現(xiàn)動(dòng)態(tài)交互的唯一方式是通過(guò)瀏覽器，它可以有效地防范數(shù)據(jù)丟失，從而是系統(tǒng)達(dá)到了較高的安全系數(shù)。JavaScript可被用來(lái)根據(jù)不同用戶定制瀏覽器，更加人性化設(shè)計(jì)的網(wǎng)頁(yè)，更容易為用戶掌握的方法。JavaScript技術(shù)是指通過(guò)小塊

82、的方法來(lái)實(shí)現(xiàn)編程。正如其他腳本語(yǔ)言，JavaScript是一種解釋型語(yǔ)言，它提供了一個(gè)方便的開(kāi)發(fā)環(huán)境。</p><p>　　在系統(tǒng)中，我們利用JavaScript腳本語(yǔ)言實(shí)現(xiàn)的關(guān)鍵功能，如加載地圖，縮放地圖，地理位置，以及其他相關(guān)的輔助功能，如地圖圖標(biāo)顯示，測(cè)距，鷹眼，標(biāo)簽。 Oracle數(shù)據(jù)庫(kù)后臺(tái)管理中所用的數(shù)據(jù)滿足需要，JSP，XML和HTML一起實(shí)現(xiàn)用戶的身份驗(yàn)證以及添加，刪除，修改，查詢信息等等。<

83、/p><p>　　該系統(tǒng)的主要功能是通過(guò)實(shí)現(xiàn)WebGIS技術(shù)在瀏覽器中顯示三維電子地圖。由于JavaScript技術(shù)和WebGIS開(kāi)發(fā)模型的組合，我們可以降低系統(tǒng)的成本，同時(shí)提高互操作性和系統(tǒng)性能。由于AJAX技術(shù)的應(yīng)用，我們可以在加載動(dòng)態(tài)地圖時(shí)得到進(jìn)一步改進(jìn)。所有我們使用的技術(shù)將減少反應(yīng)時(shí)間，這將對(duì)用戶留下一個(gè)快速和有效的印象。</p><p><b>　　五．系統(tǒng)實(shí)現(xiàn)</b

84、></p><p>　　A．創(chuàng)建三維場(chǎng)景和地圖的場(chǎng)景渲染。</p><p>　　基于WebGIS的校園三維電子地圖，是一個(gè)以東北石油大學(xué)為原型的電子地圖系統(tǒng)。為了實(shí)現(xiàn)這個(gè)系統(tǒng)，我們需要完成三維場(chǎng)景和場(chǎng)景渲染地圖的制作，所以我們選擇了操作簡(jiǎn)單而靈活的3DMAX模型。給出了電子地圖的需要，三維模型應(yīng)該是微妙的變化。由于東北石油大學(xué)太多復(fù)雜的建筑物，三維度模型的構(gòu)建將占用大量的時(shí)間。<

85、;/p><p>　　要完成三維場(chǎng)景我們應(yīng)該先準(zhǔn)備好來(lái)渲染場(chǎng)景。其實(shí)網(wǎng)格圖像三維電子地圖是固定的角度來(lái)看旋轉(zhuǎn)眼柵格地圖。空間三維實(shí)體建模后，選擇合適的渲染方法，使固定攝像機(jī)角度定位在渲染（通常在45度角），然后渲染輸出的參數(shù)設(shè)置，使它們進(jìn)入相機(jī)從固定的角度大小的圖片。</p><p><b>　　B．加載地圖</b></p><p>　　在Web中，

86、主要通過(guò)div層表現(xiàn)，有三層顯示地圖。一層是用來(lái)作為一個(gè)窗口載體地圖，該層的大小是一樣大的地圖，我們通?？吹降耐ㄟ^(guò)瀏覽器（以下簡(jiǎn)稱為窗口層）。另一層是用來(lái)遵循 (稱為移動(dòng)圖層） 的鼠標(biāo)拖動(dòng)移動(dòng)一層。另一個(gè)層是移動(dòng)的層，用于跟隨鼠標(biāo)的拖動(dòng)（以下簡(jiǎn)稱為移動(dòng)層）的，其他是介乎在窗口層和移動(dòng)層的被覆層。由用戶操作在地圖窗口是由上述的三層，地圖的基本操作是通過(guò)設(shè)置在不同的圖層功能實(shí)現(xiàn)。</p><p>　　當(dāng)加載地圖，我們

87、使用柵格數(shù)據(jù)，即我們通常所說(shuō)的圖像數(shù)據(jù)。柵格數(shù)據(jù)包括圖像數(shù)據(jù)，二維地圖和三維模擬的電子地圖。這個(gè)系統(tǒng)中的柵格數(shù)據(jù)是三維模擬的電子地圖。抽象的二維地圖使一些普通用戶很難了解他們需要的信息，但三維模擬的地圖模擬真實(shí)世界的信息準(zhǔn)確，因此用戶可以輕松地看到真實(shí)的世界。這個(gè)系統(tǒng)主要顯示地圖圖片，當(dāng)您查看或拖動(dòng)地圖，它就像一張完整的地圖圖片的當(dāng)前窗口，但事實(shí)上的小圖片拼湊而成。這些小圖片是通過(guò)特定的切圖程序?qū)⑼暾貓D切割而成；所有的圖片卡的大小都相

88、同，并有固定的命名規(guī)則，所以地圖是速度更快和更容易地加載。有完整的地圖繪制的方法很多，系統(tǒng)使用方形板的方法將地圖切割到256像素*256像素的地圖，然后寫(xiě)基于命名規(guī)則腳本完成圖片加載。</p><p><b>　　C．地圖的基本功能</b></p><p>　　拖動(dòng)，縮放，平移地圖的基本功能，也是不同于一個(gè)簡(jiǎn)單的地圖圖像的重要特征。以下是一個(gè)簡(jiǎn)要說(shuō)明的實(shí)現(xiàn)方法。要實(shí)現(xiàn)

89、拖動(dòng)，第一件事就是設(shè)置鼠標(biāo)事件功能。這些事件包括按下鼠標(biāo)和松開(kāi)鼠標(biāo)左鍵。因此，兩種功能的組合可以完成地圖導(dǎo)航。鼠標(biāo)按下事件主要是用來(lái)記錄拖動(dòng)的狀態(tài)以及目前的位置，當(dāng)鼠標(biāo)功能將捕獲的拖動(dòng)完成狀態(tài)，然后使用地圖顯示功能加載地圖。實(shí)現(xiàn)縮放的功能如下過(guò)程：</p><p>　　放大和適當(dāng)?shù)谋壤?，需要放大的增益比前值?lt;/p><p>　　計(jì)算地圖放大后中心的坐標(biāo)。公式：（point.x / ol

90、dpercent）* newpercent。</p><p>　　修改圖標(biāo)層中的數(shù)據(jù)（圖標(biāo)層邏輯操作CMAP“_ Base.js”）。</p><p>　　刪除當(dāng)前地圖的圖層，并強(qiáng)制內(nèi)存回收。</p><p>　　加載所需的地圖文件。</p><p>　　與這些基本的功能，用戶可以觀察整個(gè)校園簡(jiǎn)潔清晰地建筑物。地圖分為五個(gè)縮放級(jí)別，用戶可以放

91、大出來(lái)要查看更多的建筑物，也可以放大以檢查建筑細(xì)節(jié)。</p><p><b>　　D．其他實(shí)用功能 </b></p><p>　　突出顯示以及彈出提示框</p><p>　　對(duì)于一些熱點(diǎn)建筑物的查詢，我們使用 JSON 數(shù)據(jù)創(chuàng)建一個(gè)div 圖層，填充顏色，然后設(shè)置為半透明，當(dāng)鼠標(biāo)移動(dòng)到圖層，該區(qū)域?qū)⑼怀鲞x擇。當(dāng)鼠標(biāo)點(diǎn)擊突出顯示的區(qū)域，會(huì)彈出一個(gè)

92、小窗口，顯示了建筑的細(xì)節(jié)。以一個(gè)體育場(chǎng)為例，當(dāng)鼠標(biāo)不在體育場(chǎng)，建筑沒(méi)有什么變化，但在體育場(chǎng)上空，移動(dòng)鼠標(biāo)時(shí)，建筑物的輪廓顯示。當(dāng)點(diǎn)擊的亮點(diǎn)體育場(chǎng)，體育場(chǎng)將彈出的一些基本信息，如體育場(chǎng)辦公室的電話，詳細(xì)地址，基本輪廓。</p><p><b>　　范圍</b></p><p>　　經(jīng)度和緯度與校園電子地圖坐標(biāo)之間的相互轉(zhuǎn)換，我們可以先變換校園電子地圖坐標(biāo)的經(jīng)度和緯度坐標(biāo)

93、，然后通過(guò)計(jì)算兩個(gè)點(diǎn)之間的距離的緯度和經(jīng)度坐標(biāo)，這種方法是簡(jiǎn)單和精確。</p><p><b>　　標(biāo)簽顯示和隱藏</b></p><p>　　為了提示一些關(guān)鍵的地方（如公共交通站、 路牌），圖中使用中其標(biāo)簽進(jìn)行標(biāo)記的新圖層，很方便的為用戶認(rèn)識(shí)到特定的位置，但標(biāo)記信息將影響顯示整個(gè)場(chǎng)景，因此，用戶可以選擇在需要的時(shí)候顯示標(biāo)簽。</p><p>

94、<b>　　實(shí)時(shí)坐標(biāo)和鷹眼</b></p><p>　　通過(guò)位于電子地圖的右下方角落的鷹眼地圖，用戶可以大致了解他們?cè)谀抢锏男@。拖動(dòng)綠色方塊中的鷹眼地圖可以快速定位到您想要的位置。左下角區(qū)域?qū)崟r(shí)顯示系統(tǒng)中的鼠標(biāo)光標(biāo)的坐標(biāo)值。</p><p><b>　　查詢定位功能</b></p><p>　　最后設(shè)計(jì)的系統(tǒng)很容易操作，

95、它提供了快速導(dǎo)航到主頁(yè)。如果您選擇某些類型的建筑物，它將在右邊列出所有類似的結(jié)構(gòu)的建筑物。點(diǎn)擊建筑物名稱，可以快速的找到相應(yīng)的位置和顯示信息相關(guān)建筑。查詢數(shù)據(jù)保存在Oracle關(guān)系數(shù)據(jù)庫(kù)中，而定位的坐標(biāo)值從JSON文件獲取。通過(guò)相同的字段名稱實(shí)現(xiàn)本地化詢問(wèn)整合連接查詢和本地化。當(dāng)來(lái)模糊查詢，在查詢框中輸入關(guān)鍵字，所有相關(guān)信息將被顯示。您還可以輸入精確的查詢，找到相應(yīng)的建設(shè)，以了解它的確切名稱。</p><p>&

96、lt;b>　　六．結(jié)論</b></p><p>　　基于WebGIS的校園三維電子地圖結(jié)合簡(jiǎn)單的二維電子地圖與現(xiàn)實(shí)，豐富和直觀的三維虛擬場(chǎng)景。使用JavaScript技術(shù)的地圖系統(tǒng)，XML技術(shù)，Oracle數(shù)據(jù)庫(kù)等技術(shù)實(shí)現(xiàn)信息的傳輸和交互操作。系統(tǒng)本身是跨平臺(tái)的B／S模式，頁(yè)面友好，安全，易于維護(hù)和允許一個(gè)更廣泛的用戶動(dòng)態(tài)地訪問(wèn)和操作簡(jiǎn)單。</p><p>　　來(lái)源：Yi