touring hong kong via the www

Ž .Computer Networks and ISDN Systems 30 1998 1991–2001

Touring Hong Kong via the WWW

Vincent Ng ) ,1, Stephen Chan, Chak Man Ng, Fergus TangDepartment of Computing, Hong Kong Polytechnic UniÕersity, Hong Kong, China

Abstract

Ž .In this paper, we present our design of a GIS Geographic Information System to provide tourist information to visitorsvia the WWW. The system can help a tourist, even when he is not in Hong Kong, to find information about routes,buildings, underground railways and train stations. Further, the GIS also allows a tourist to interact with the displayed mapby zooming, scrolling, panning, finding out a walking path between two locations with a time estimate, and linking to otherWWW locations of tourist hotspots in Hong Kong. q 1998 Elsevier Science B.V. All rights reserved.

Keywords: WWW; GIS; Tourist; Quad-B tree; Quad-R tree

1. Introduction

Ž .Geographic Information Systems GISs are com-puter systems that combine mapping and databasemanagement systems for storing, manipulating andanalyzing large volumes of spatial and non-spatialdata. Example uses of such systems are forecastingin potential market areas, risks analysis, resourcemanagement and urban planning. However, at pre-sent, many users and developers are limited to localaccesses of a GIS. Only recently, the use of GISs via

Ž .the WWW World Wide Web on the Internet isw xappearing, such as the Virtual Tourist 1 , and the

) Corresponding author.1 The work of the first author was supported in part by the

RGC Grant: 0357r017 and in part by the Polytechnic UniversityResearch Grant: 0351r089.

w xTIGER Mapping Service 2 . Nevertheless, most ofthem still have some limitations as followed:1. They are stateless interface programs that do not

remember how a user interacted with the programin the past.

2. Only simple interactions, such as single pointclickings and text data input, are supported.

3. When maps are updated, new HTML documentsare generated and downloaded. Hence, it pro-duces higher network traffic and many redundantcache pages.Thus, there is a need to develop a better Internet

gateway which can provide remote users with visualquerying of GIS data and allow them to manipulate amap just as in a local GIS. Amongst the manysystems available on the WWW, we have selected

w xtwo of them, the Virtual Boston 4 and Cool Javaw xMap 3 to study further.

The Virtual Boston is a geographic informationsystem developed by Edward Wang. He had built aninteractive map of Boston, New York and Lowell.

0169-7552r98r$ - see front matter q 1998 Elsevier Science B.V. All rights reserved.Ž .PII: S0169-7552 98 00214-1

( )V. Ng et al.rComputer Networks and ISDN Systems 30 1998 1991–20011992

The system supports map navigation and zooming.ŽWhen a user clicks on a blue label which links to a

.uniform resource locator, or URL on a map, it willstart browsing a new WWW location. It also has thefunction of finding a location by performing a key-word search. However, when we scroll a displayedmap, the time to refresh it is obviously long as thereis always a need to transfer more data from theserver. Further, the zooming feature is limited to thelabels provided by the system and a user cannotdefine his own region.

The Cool Java Map is a geographic informationsystem developed by Andy Wick. It can displaydifferent regions of the world, such as the UnitedStates, Washington DC, Blacksburg VC and WorldView. It has similar functions as those in VirtualBoston plus the option of allowing a user to addmore URLs. A unique feature of the system is thedisplay of an overview of the world. Through theoverview, a user can select different regions of inter-est for better display detail. However, it has the samedisplay problem as in the Virtual Boston systemwhen a map is refreshed.

After thoroughly reviewing the two systems, weobserve that there is still much room for improve-ment. For example, the zooming functions of bothsystems do not allow a user to select a rectangularregion for zooming. The panning function is slowwhen we try to move the map around. In a simpletest run, we observed that every panning request tookabout 30 seconds on average to redraw the map.

In our work, we are currently focused on the dataretrieval part for map manipulations. In addition tothe common features, such as map displaying andzooming, we decide to include new features for aWWW GIS as followed.Ø Showing the location legend when there is needØ Displayed in two languages: English and ChineseØ Human-like voice audioclip for the map descrip-

tionØ Progressive data transferØ Walking path searching

The above requirements can be partially satisfiedwith form processing, imagemaps, and CGI inter-

w xfaces 5 in a common WWW environment. How-ever, the support of graphical interactions is weak in

w xthe current HTML 2.0 specification 6 and even thenew HTML 3.0 specification. Therefore we have

w xselected Java 7 as the development platform todevelop a map query application named HKMap.

2. The HKMap system

There are a number of design considerations inthe development of the HKMap system. Initially, wewant to have a good data structure to store and toindex the spatial data for fast query performance. Itis also important to consider how we can reduce theamount of data transfer on the network so as toprevent redundancy and inefficiency. For the mapdata that we acquired, most spatial objects are repre-sented as polygons. This creates a number of prob-lems when we try to implement some of our pro-posed features. In this section, we will discuss howwe try to solve the above problems in the HKMapsystem.

2.1. Data storage and indexing

There are different types of spatial data in theHKMap system. Each type of data represents athematic layer of a map. The data is either formattedas polygons, lines or points. Data is initially stored ina remote database and later transferred to a localclient. Therefore, we need to handle two differentstorage organizations. One in the remote server andone at the client side. In our design, each thematiclayer is stored as a table in the remote database. Theentries in a table are sorted and the inter-relation-ships between tables are stored in a separate table.This simple organization only requires the standardoperations in a relational database management sys-

Ž .tem DBMS . Hence, we can make use of manypopular DBMSs to support the HKMap system.

The simple organization in the server side doesnot work well to support spatial queries. At the clientside, we use the object-oriented approach and storethe spatial data as objects. When data is transferredto a client, they are converted into spatial objects inwhich related points, lines or polygons are all linkedtogether. This will avoid the expensive table joinsduring the display of maps. Further, the spatial ob-

w xjects are indexed by the quad-B tree 8 or the

( )V. Ng et al.rComputer Networks and ISDN Systems 30 1998 1991–2001 1993

w xquad-R tree 9 depending on their respective types.With this setup, an exact point query or a windowquery can be performed much faster.

2.2. ProgressiÕe data transfer

When a map is displayed, it is not necessary toretrieve all the data at once. The amount of datarequired should depend on the coverage and thedetails of a map. Therefore, we have developed theprogressive data transfer method. The idea is totransfer more spatial data only when a zoomingoperation is performed. For each line, we divide itinto 6 levels. Each level represents a number ofpoints and the amount of details needed. The lowerthe level, the less data is available. Also, points aresorted and each has its unique sequence number forthe original line. The first level contains the firstpoint and the last point of the line. The second level

contains two center points in between points in levelone. The third level contains the mid-sequence pointsof points in level 2, and similarly for level 3, 4 and5. At the end, level 6 contains all the remainingpoints. Fig. 1 shows how a line with 13 points isplaced in the 6 levels.

When a client request is sent, it will include thelevel information and the server will reply with thecorresponding points to the client. After receivingthe spatial data, the client will synchronize its datastorage by inserting the data accordingly.

2.3. Display buffers

Another technique to ensure smooth map updatingin the HKMap system is the use of a triple bufferingtechnique. It is an extension of the popular doublebuffering technique, but three graphics displayingbuffers are allocated when the system is initialized.

Fig. 1.


The first two graphics buffers are used just as in thetraditional double buffered technique. That is, whena buffer is displayed, another buffer is being up-dated. However, these two buffers only cover thedisplayed portion of a map. The complete map is ofmuch bigger size and is stored in a third buffer.When a map is scrolled, we will only need to copydifferent regions from the third buffer into the othertwo buffers in order to provide a smooth scrolling.

2.4. Finding a walking path

In the HKMap system, we support a user to findout a walking path between any two points on themap. However, for our digital map data, we do nothave any simple lines to represent roads. Each roadis only observed as a continuation of gaps in be-tween buildings, flyovers or parks. A heuristic walk-

ing path algorithm is therefore proposed. The searchstrategy first defines a query window composed bythe starting point and the destination point. It thenselects all the polygons overlapped with the querywindow. Each polygon is represented by a number ofline segments. The closest polygon to the startingpoint will be identified and its line segments aretraced in order to find out a crossing point to thenext polygon. In our algorithm, we use the direc-tional information to guide the selection of the cross-ing points, and the next polygon will be closer to thedestination point. After tracing a number of poly-gons, we will finally reach the destination point. Werealize that this algorithm will not provide the short-est path between the two points but it has a goodtime performance. In Fig. 2, the algorithm starts withline 1034, then line 3405 and line 4555 beforereaching the destination.

Fig. 2.


2.5. Road orientation detection

We want to generate a report after a walking pathhas been identified. In doing so, we would need tofind out the names of the roads. However, we have

Ž .the names legends of roads but not with any associ-ated lines. One can try to guess the name of a roadby locating the closest legend to a given point in awalking path. Though, it does not work when theroad is long and its legend is far away from thepoint. Therefore, a road orientation detection func-tion is proposed. It is a complementary function tothe path finding feature in locating road names and isused to detect whether a road is nearly horizontal orvertical.

The detection algorithm determines a road’s ori-entation by calculating the distances from an arbi-trary point inside the road to its closest edges. If thepoint touches an edge faster in the horizontal direc-tion, it concludes that the road is vertical; otherwise,the road is horizontal. With the guessed direction, we

can try to find out the road’s legend along thatdirection. The colors of individual pixels in the mapcan be used to do the guessing. We first convert allpoints within a road to a specific color. We thenselect a point and calculate the distances from thepoint to the borders of the colored region. Thedirection with more pixels being traced will be theresult.

3. HKmap interface design

When the HKMap system is invoked, it appearsin a WWW browser as in Fig. 3. At the top ofwindow, there is a menu bar which a user canperform most of the system functions. At the lefthand side, there is a map window which shows thecurrent view of a map. At the right hand side, thereare four sub-windows. The first sub-window displaysa complete map. In the current setup, it shows the

Fig. 3. Screen layout of HKMap.


Tsim Sha Tsui district of Hong Kong. Within themap, there is a rectangular box which corresponds toa sub-map displayed in the map window. There is acompass inside the map to show the current north-ward direction also. The second sub-window is usedto show a textual description of a selected location.The selection is done by double-clicking a hotspot inthe map window. The third sub-window displays theURL of a selected hotspot if there is one available.The forth sub-window is used to show a walkingpath report after a user has performed a path findingoperation. Underneath the displaying windows, thereis a control panel which allows a user to downloaddata, reset the displayed map and zoom in and out ofthe map. Just above the control panel, there is astatus bar which shows the map coordinates wherethe mouse cursor is located in the map window.

3.1. Scrolling the map

There are two scrollbars associated with the mapwindow. The horizontal scrollbar at the bottom canmove a map left-right, and the vertical scrollbar canmove a map up-down. An example is shown in Fig.4.

3.2. Selecting different layers of spatial data

In the system, there are two groups of thematiclayers of spatial data. The first group is related tolocations, such as buildings, hotels, and train sta-tions. The second group is related to line objects,

Fig. 4. Scrolling of a displayed map.

Fig. 5. Selecting different layers of data via a toolbar.

such as railways and hydros. A user can decide whatinformation to be displayed in the map window. Atoolbox can be invoked through either the LocationType On or Line Type On options in the menu barŽ .see Fig. 5 . The system will then pop up a Line

Ž .Type or a Location Type toolbox and the user canselect the layers by toggling the states of the buttonsinside.

3.3. Information of a clicked location

Very often, a user would want to know moreabout a particular location on a map. While browsingin the map window, a user can press the mousebutton on top of a building and its correspondingname will be popped up. Similarly, when the mouse

Fig. 6. Displaying the description of a location.


Žmoves near a tourist hotspot marked as H for hotels,.C for cinemas, or M for underground train stations ,

the detail information about that location will appearin the second sub-window on the right hand side. Asample of the operation is shown in Fig. 6.

3.4. Linking to other WWW sites

We have adopted the linking idea in the Cool JavaMap system. For hotspots that have their own WWWsites, we save their URLs in our database. When auser selects a hotspot which has a correspondingURL, the URL will be shown at the third sub-windowat the right hand side. The user can select the URLby moving the mouse on top of it and perform adouble-click. A new WWW browser will then appear

Ž .on the screen with the new URL see Fig. 7 .

3.5. Viewing a new map without retransmission ofdata

A user may want to view two different regions ofthe same map concurrently. To do so, he can selectthe New Window option inside the Window option.A new window will then be run concurrently withthe original one. The user can browse the new mapwith different location types or thematic layers. Inthe HKMap system, both browsers will be sharingthe same cache for the spatial data and no re-trans-mission is needed. A sample screen is shown in Fig.8.

Fig. 7. Linking to other WWW sites.

Fig. 8. Opening a new window.

3.6. Zooming

A user can select any region in the map windowfor zooming. He can first select a position, continu-ally press the left button of the mouse, and start todraw a rectangle by dragging the mouse cursor.When the mouse button is released, the rectanglebecomes the region of zooming in the map window.The actual zoom operation can then be done bypressing the Zoom button in the control panel. Theuser can reset back to the original map by pressingthe Reset button in the control panel later. Figs. 9and 10 show the screens before and after the zoom-ing operation.

Fig. 9. Zooming by drawing a rectangular region.


Fig. 10. Zooming result.

3.7. Find a walking path

When a tourist is visiting a city, he may want tovisit nearby locations around the hotel in which he isstaying. In particular, he may want to visit placesthat are within walking distance. In the HKMapsystem, a user can find a possible walking pathbetween two locations on the map. At the beginning,the user would need to set the originating and desti-nating locations by using the set location and settarget options available in the menu bar. After that,he can select the search path option or press F6 tostart searching. The suggested path will be shown onthe map and related information will displayed at theforth sub-window at the right hand side. In Fig. 11,the two animated frogs represent the starting andending locations and the path will be displayed by

Fig. 11. Finding a walking path.

Ž .Fig. 12. Comparison of querying features between TMS A , Vir-Ž . Ž . Ž .tual Tourist B , Yahoo Maps C and HKMap F .

animating the movements of the frog walking alongthe suggested path.

4. HKMap implementation

In our initial prototype of the HKMap system, wehave selected the Tsim Sha Tsui District, which is apopular tourist area in Hong Kong, as the basicmapping region. The digital map data is obtainedfrom the Lands Department of the Hong Kong Gov-ernment. There are 22 map sheets to cover all the

Fig. 13. Comparison of querying features between VirtualŽ . Ž . Ž .Boston D , Cool Java Map E , and HKMap F .


Ž .Fig. 14. Comparison of the panning times secs and zoomingŽ .times secs between Virtual Boston, Cool Java Map, and HKMap.

regions in Hong Kong and Tsim Sha Tsui is one ofthe highest populated districts. In addition to thespatial information such as roads, buildings, trainstations and railways which are available in the mapsheet, we have also included locations and descrip-

Ž .tions of tourist hotspots hotels, cinemas, etc. andtheir URLs in our database.

The system is implemented in Java and runs on aWWW browser such as the Netscape 3.0 or theInternet Explorer 4.0. It is a typical development of aclient–server computing application. There is a re-mote mapping server, which stores spatial and aspatial data in an Oracle database, responding toclient queries. A client prepares a query at a WWWbrowser, and sends it to the server. The serveraccepts the request and then returns the query resultsto the client for display.

There are many Java classes developed for theHKMap system. We can divide them into three

Fig. 15. Java classes.


groups. The first set of classes are under the databasegroup which take cares of data requests and transfersfrom the remote database. The second set is themapping group which will organize the data forlocal display. The final set of classes is under theinterface group. It is used to perform the actual mapdisplays and to handle user interactions. Some of thehigh level Java classes of the HKMap system areshown in Fig. 15.

After we have finished the first prototype of theHKMap, we tried to evaluate its performance. Soonafter, we find that it is difficult to compare therelative performance for different WWW GIS sys-tems. In general, there are two approaches to supportWWW GIS interfaces: the CGI approach, and theJava approach. Both approaches support interactiveGIS queries but they are of very different behavior.With the CGI approach, a zooming operation willrequire another transfer of an image over the Inter-net; whereas the Java approach may not need thetransfer. Therefore, when we compare their zoomingperformance, we may be actually measuring thenetwork speed.

In order to review the pros and cons of theHKMap, in Figs. 12 and 13, we have comparedsome GIS query operations available in HKMap andfive other WWW GISs. The TMS, Virtual Touristand Yahoo Maps are based on the CGI approach;whereas the Virtual Boston and Cool Java Map arebased on the Java approach.

We have also done some experiments to measureŽthe relative performance of three WWW GIS Vir-

.tual Boston, Cool Java Map and HKMap which arebased on the Java approach. In our experiment, wetried to have two types of time measurements whichdo not depend on the network speed solely. The first

Ž .measurement is the panning time p-time when wemove a map. It is measured as the time intervalbetween the moving stopped and the completion ofthe map being re-displayed. The second measure-

Ž .ment is the zooming time z-time . It is measured asthe time interval between the issuing of a zoom-outcommand and the completion of the map re-display.For each of the three GISs, we repeat the panningand zooming operations 20 times at different timesof the day and their average results are reported inFig. 14. The table shows that the HKMap has abetter performance in both measurements. Besides

the possible network throughput reason, we thinkthat this could be due to HKMap requiring less datatransfer over the Internet by utilizing the triplebuffering technique, the map data stored in theclient’s local cache, and the progressive data transfermethod.

5. Conclusions

There is a need to develop an interactive andgraphical WWW gateway that supports remote usersto perform spatial queries of GIS data. The HKMapsystem has demonstrated the possible improvementon interactions by using the Java Language. In thesystem, we have developed a set of basic interactionfeatures, such as zooming, scrolling or panning,changing the displayed color, finding location, andlinking to the outside world. Other advanced featuressuch as building recognition, playing audio clips fora selected location, and finding walking path are alsoprovided.

We plan to improve some of the deficiencies ofthe system in the future. At present, the road recogni-tion is not accurate enough, and we need to developa better algorithm. In our system, we are currentlytransferring spatial data in a textual format and thishas increased the downloading time. A better ap-proach, such as the use of a binary file format,should be investigated. Amongst the data given bythe Lands Department, the height information ofbuildings has not been used. We can use this infor-mation to display 3-D maps in our next version ofthe system.

References

w x1 Virtual Tourist, http:rrwings.buffalorworld.w x2 Tiger Mapping Services, http:rrbox.census.govrcgi-binr

mapbrowse-tbl.w x3 A. Wick, Mapplet, http:rrmaps.purple.orgrmaprindex.html.w x4 E. Wang, T. Ng, Virtual Boston, http:rrwww.pmg.lcs.mit.

edur ;ngrMapr.w x Ž .5 Common Gateway Interface CGI , NCSA — National Center

for Supercomputing Applications, http:rrhoohoo.ncsa.uiuc.edurcgiroverview.html.

w x6 M. Hannah, HTML Reference Manual, Sandia National Labo-ratories, 1995.

w x TM7 J. Gosling, F. Yellin, the Java Team, The Java Application


Programming Interface, vol. 1, Core Package, Addison-Wes-ley, Reading, MA, 1996.

w x8 V. Ng, T. Kameda, Quad-B tree for point data, in: Proc. Int.Symp. on Cooperative Database Systems, Kyoto, Japan, De-cember 1996, pp. 12–18.

w x9 V. Ng. T. Kameda, Quad-R tree for rectangular data, Personalcommunication.

Vincent Ng received the B.Sc. degree inmathematics and computing sciencefrom the Simon Fraser University,Canada in 1982. He later studied in theUniversity of Waterloo, Canada, and re-ceived his M. Math. degree there in1986. In 1994, he received his Ph.D.degree from Simon Fraser University.Since 1994, he has been an assistantprofessor in the Hong Kong PolytechnicUniversity. His research interests in-clude spatial databases, data mining andmedical imaging.

Stephen Chi Fai Chan received a B.Sc.in electrical engineering from the Uni-versity of Rochester, an M.Sc. from theUniversity of Wisconsin-Madison, and aPh.D. from the University of Rochesterin 1987. He has since worked for acomputer graphics company and the Na-tional Research Council of Canada be-fore joining the Polytechnic Universityin 1993, and is currently an associateprofessor in the Department of Comput-ing. His research interests include geo-

metric modelling, data engineering, computer-integrated manufac-turing information systems, and computer-aided learning.

C.M. Ng received his B.Sc. and D.Phil.degrees from the University of Ulster,United Kingdom in 1987 and 1993 re-spectively. Prior to joining the HongKong Polytechnic University in 1995,he was on faculty in the School of Soft-ware Engineering and Information Sys-tems, University of Ulster, where hetaught computer and multimedia infor-mation systems. Dr. Ng has been en-gaged with computer graphics researchin his doctorate study. He has numerous

publications in international journals and conferences. His currentresearch interests include computer graphics and multimedia infor-mation systems.

Fergus Tang graduated from Hong Kong Polytechnic UniversityŽ .with a BA Hons in Computing Studies in 1997. He is interested

in Java programming and Internet applications.

touring hong kong via the www

Documents