A Spatial Information Publishing Approach and Applications for Region Level "Clearing House"

Keywords: XML+GML+SVG, clearing house, spatial information service, Applications

Yan Li, Prof.
Director
Spatial Information Research Center, South China Normal University
Guangzhou
GuangDong
China
yanli@scnu.edu.cn

Biography

Yan LI is a Professor of Computer Science Department, and Director of Spatial Information Research Center, South China Normal University. Her research topic is focused on the theory and methods of spatial information and also continued the research works on Remote Sensing and GIS applications. The project are been implementing as follows: "Spatial Information Integration and applications in Guangdong", "a prototype of hyper-spectral image processing System development", "Reconnaissance and Design of SDSS for controlling flood, hurricane and drought", "Environment monitoring with hyper-spectra data" etc. Since 2002, she started to study the XML-SVG applications and had developed a spatial planning tool based on XML-SVG, the demos of real estate and census information systems etc. Now, she is working on the project to develop a province level 'spatial information service system' with SVG-platform as a project leader.

Guobin Chi, Prof.
Director
Spatial Information Research Center, South China Normal University
Guangzhou
GuangDong
China

Biography

Wenfei Luo,

Computer Science Department, South China Normal University
Guangzhou
GuangDong
China

Biography

---

Abstract

---

With the development of spatial information used widely in the whole society, a regional level of a 'clearing house' is regarded as an important information infrastructure in IT engineering construction. It is important to create a supported platform "spatial information service system" for the 'clearing house' and providing the service functions such as interactive operating, dynamic updating, crossing platform and sustainable utilizing etc. It was developed using the combined techniques with a new Web publishing standard language ------ XML Schema + GML + SVG, Java Script, Asp.Net and C++ Builder for the different layers of a software architecture and the components.Tt was carefully planned the whole system which is composed of metadata base managing, metadata querying, regulars and standards publishing, spatial information querying and publishing, security managing, distributed metadata base managing, spatial data conversion, information sharing and processing, multi-scale spatial information fusion, and mapping aid tools. During the software development, the mapping aid tools were developed as a group of components including table making, color filling, Graphics editing and topo building etc functions in the system. Up to now, it was only created a friendly and conveniently interactive environment for the users to query spatial information. Through the system developing procedure, XML Schema + GML + SVG was taken an important role and brought out the advantages in Web based software developed such as vector data dynamic publishing, graphic interactive operating, spatial metadata organizing and the extensibility etc. Being one of future tendency in internet development, this paper was discussed the methods and working flow, and given some components of the spatial information service system with a case study of Guangdong Spatial Information Clearing House. And the paper was also given some applications based on the regional level 'Clearing House' to prove its advantages and practicality. The case studies were included dynamic publishing the ecological environment, restored forestry planning, real estate information publishing and dynamic meteorology information publishing etc.

---

Table of Contents

---

1. Introduction
2. Theories, techniques and methods
     2.1 XML Schema
     2.2 GML Schema
     2.3 SVG
     2.4 XML Database
         2.4.1 visualizing database management with SVG
         2.4.2 native XML database
     2.5 XLST
     2.6 Web Service
3. Integration scheme design
     3.1 Architecture of the software
     3.2 The client side
     3.3 The server side
     3.4 Visualizing tools with SVG
         3.4.1 Graphics editing tool
         3.4.2 Charts making tool
4. Implementation and applications
     4.1 Project background
     4.2 Project background
     4.3 Implementing procedure and Applications
         4.3.1 Map zooming in or out
         4.3.2 Map roaming
         4.3.3 Attributes querying
         4.3.4 Graphics interactive operation
         4.3.5 Layer controlling
         4.3.6 Color rendering
5. Conclusion
6. Appendixes
Footnotes
Bibliography

1. Introduction

Human being coming into a new century of globalization and network, spatial information is going to play more and more important role in whole society as the rich spatial information gradually provided via network. It is necessary to be extended its application fields in order to meet the demands of the real world. Nevertheless, spatial information applications were usually relied on a specific software product of spatial information or GIS. Users can't obtain the spatial information service unless they buy or own the usufruct of certain product. In addition, there are various types of the software products each of them has its own interfaces and data formats in which were made the difference and the limitation and isolated the spatial information resources based on network from users. There are two gaps between them: one of them is information gap that was mainly caused by different software; another one is understanding gap that is due to the complex data structure of spatial information and different data models. On the other side, most of the spatial information resources are department or industry orientated and depended on supported environment or software running environment. This is why all the information are isolated, independent, no sharing and no communicating etc. Thereout, sharing spatial information resources via network has become more and more urgent, it is necessary to create a supported platform "spatial information service system" for the 'clearing house' and providing the service functions for crossing platform, dynamic and interactive operation, and interoperation in order to fulfill the public demands.

XML is considered to be a new generation of network publishing standard language and the successor of component software technologies. The main feature of XML is a technology that layers type and structure over information. Just about, the layering of XML technologies allows the structure and type system of XML to be used independently from the standardized representation used to store XML based information in files or network messages. This independence allows disparate software agents to interoperate by modeling application boundary crossing in terms of application-specific types, secure in the knowledge that an XML-based representation of these types can be exchanged across language, process, host, and vendor boundaries. This feature has made XML the heir apparent to the component software technologies popularized in 1990s. And XML applications will become a hot point on studying spatial information sharing in information epoch.

This paper was discussed the procedure in studying and creating a supported platform "spatial information service system" for the 'clearing house' and providing the service functions such as interactive operating, dynamic updating, crossing platform and sustainable utilizing etc. It was developed using the combined techniques with XML Schema + GML + SVG, Java Script, Asp.Net and C++ Builder for the different layers of a software architecture and the components. The paper was started the analysis from XML Schema, GML Schema, SVG presentation, Web Service and data storage etc.

2. Theories, techniques and methods

2.1 XML Schema

XML Schema is a rich language with many capabilities and subtleties. An XML Schema consists of components such as type definitions and element declarations. These can be used to assess the validity of well-formed element information items (as defined in [XML-Infoset] [1] ) and furthermore may specify augmentations to those items and their descendants. This augmentation makes explicit information, which may have been implicit in the original document, such as normalized and/or default values for attributes and elements and the types of element and attribute information items. The normative parts of the specification use the W3C XML Schema language to can be used to describe the grammar of conformant GML data instances.

2.2 GML Schema

The Geography Markup Language (GML) is an XML encoding for the modeling, transporting and storage of geographic information including both the spatial and non-spatial properties of geographic features. This specification defines the XML Schema syntax, mechanisms, and conventions that:

1. Provide an open, vendor-neutral framework for the definition of geospatial application schemas and objects;
2. Allow profiles that support proper subsets of GML framework descriptive capabilities;
3. Support the description of geospatial application schemas for specialized domains and information communities;
4. Enable the creation and maintenance of linked geographic application schemas and datasets;
5. Support the storage and transport of application schemas and data sets;
6. Increase the ability of organizations to share geographic application schemas and the information they describe.

Implementers may decide to store geographic application schemas and information in GML, or they may decide to convert from some other storage format on demand and use GML only for schema and data transport. And a GML application schema is an XML Schema written according to the GML rules for application schemas and which defines a vocabulary of geographic objects for a particular domain of discourse. And a GML data model defines the various entities such as features, geometries, topologies etc. Through a hierarchy of GML objects as shown in the UML diagram in Fig.1 below. Figure 1

Figure 1: Hierarchy of GML objects as shown in the UML diagram

		< complexType name="StringOrRefType">
		< simpleContent > 
		< extension base =" string "> 
		< attributeGroup ref =" gml:AssociationAttributeGroup "/> 
		</ extension > 
		</ simpleContent > 
		</ complexType >
	

2.3 SVG

TSVG is an XML application, the information about an image is stored as plain text instead of representing raster graphics using a matrix of color points. The vector-based SVG graphics greatly improves the image quality of the graphics, and it brings the advantages of XML's openness, transportability, and interoperability. CAD and graphic design programs often store drawings in a proprietary binary format. By adding the ability to import and export drawings in SVG format, applications gain a common, standard format for interchanging information.

SVG can be cooperated with other XML applications. It means it can also leverage a variety of XML standards-based functionality to generate and process the content. A map, for example, could use XSL Formatting Objects for making SVG chart, GML to describe geographical features, and SVG to generate the graphs for the map visualizing. Moreover, with its animation features and SVG DOM interfaces, we can code intelligence into SVG graphical applications.

2.4 XML Database

2.4.1 visualizing database management with SVG

SVG can help us achieve an approach leveraging native XML database functionality, XSLT and SVG to help DBAs visualize the data and its metadata for database management. The application also uses the SVG DOM APIs to build an interactive interface to provide on demand visualization for better decision support and applied demands.

2.4.2 native XML database

The native XML functionality can be used to deliver XML content. [4] First, use XSLT to generate SVG and manage SVG code fragments by storing them in native XML data types, which can be directly accessed through the database's HTTP server; then, use an XML database such as Oracle 9.2, it can leverage a set of high-performance native XML to easily combine data or metadata of database into XML documents and process them to produce SVG graphics. The process is simplified because all these operations can be handled within SQL or PL/SQL commands. XML databases provide the capability to link to the content both internally and externally. In case of an Oracle XML database, this is expressed as a DBUri pointing to the resources in Oracle XML database repository ( XML DB Repository ). This repository can be used to store the resources for the application, including the XML Schema files, the XSL Stylesheets and the generated SVG reports.

2.5 XLST

XSLT (Extensible Stylesheet Language Transformations) is a conversion language implemented between different XML formats [5] . Due to the SVG itself is a XML document, it is nature that the chart stylesheets can be implemented with XSLT. XSLT processor is defined a tree structure as its input and produced another tree structure as its output shown in Figure 2 [6] The processor is produced the tree structure of input XML document via grammar analysis and ordered them as target XML document. XSLT is composed of stylesheet templates based on the concept of functionality programming of conventional programming languages such as Lisp, Haskell and Scheme. Each of these templates is basically defined only a single function -- a part of output tree and its function.

Figure 2: The working principle of XSLT processor

2.6 Web Service

Web Service [7-10] is a new system architecture and distributed calculating standard, it is combined the advantages of COM technique and network communion. It is constructed the basic models of applied programs through applied program units which is easily to access via standard network protocol. Equally with COM technique, implementing procedure of Web Service was also encapsulated in a black box, which can be queried by the other programs via the interfaces provided. And it is executed the complex and intelligent communications between various nodes of the network through a series of standard protocol. The communication between Web Services is based on XML - SOAP and HTTP, which can provide network communion without language and platform limitation.

Web Service is usually constructed a whole technical frame taking an applied or practical case by using Web Services technique. It is implemented the object accessing, instances, working flow and security mechanism etc under a loosing and coupling environment where is supported by a series of protocols and rules.

3. Integration scheme design

The general scheme design was divided into two parts including the server side or background and client side or foregrounding. The former one is supported by a spatial data warehouse, which is composed of integrated spatial database and metadata database. The later one is provided spatial metadata information querying and spatial information querying, processing and analyzing modules via spatial information service system.

3.1 Architecture of the software

The general architecture of the system was designed for five layers shown in Figure 3 and Figure 4 And the main functions of each layer were described in Table 1

Figure 3: Architecture Design of system foregrounding

Figure 4: Architecture Design of system background

3.2 The client side

On the client side or foregrounding, the system is only dealt with three layers including 5) Spatial Information publication and Application;4) Spatial Data Market; and 3) Spatial Data Warehouse following a top-down orders.The functions of each layer are shown in Table 1

3.3 The server side

On the server side or background, the system is managed with another group but also four layers including 4) Spatial Data Market; 3) Spatial Data Warehouse; 2) ETL Process; and 1) Multiple Data Source following a top-down orders. The functions of each layer are shown in as the same Table 1

Table 1 the layers description of system architecture

Table 1

3.4 Visualizing tools with SVG

Based on the requirement analysis, the visualizing tools were organized in 8 individual packages. They were divided into graphics editing tool, chart making tool, database managing tool, animation making tool, mapping tool, word processing tool, system setting and general tool. Here is just given tow modules or packages of graphics editing tool and charts making tool.

3.4.1 Graphics editing tool

According to demands of this package, the designed functions are included in vector graphic editing, color filling, topo building, vector/raster converting and color models defining. The details functions and the structure are shown in Figure 5

Figure 5: Designed functions in graphic editing package

1. Editing vector graphic
   It is common that input data are always not satisfied the applications thus the spatial graphic data have to be precisely defined and processed editing. In another case, the data are always needed to be update. By this token, it is necessary to develop a vector graphic editing tool and its functions at least included: drawing path, editing path, and polygon editing etc function components as shown in Figure 6
2. Conversion from vector graphic to bitmap image
   The process of changing a vector graphic to a bitmap image is called rasterization . During rasterization, it converts the graphic's paths into pixels. The rasterization options you set determine the size and other characteristics of the resulting pixels. There are two ways to rasterize vector graphics: the Object Rasterization and the Effect rasterization. Once graphics are converted by either method, you can apply plug-in filters to the image as you would with any placed image. However, you cannot apply vector tools and commands to modify the bitmap image.

Figure 6: Designed functions in vector graphic editing component

3.4.2 Charts making tool

In the spatial information service system, there are lot of attribute data like census data and other statistic data that need to be published in charting stylesheet. It was proved that XSLT is a helpful technique to execute the dynamic chart Web publishing with its ease operation, distinguished structure and a strong repetitive usage of the codes. It is combined with the techniques of Java Script and XML-SVG for client side and ASP.NET for server side. The function on server side is mainly implemented the operation of database. The related operations of the procedure based on XML as follows:

Query(Original Data Result)->Transformation(XML Census Data)->Transformation(SVG)

For instance, when a rectangle window selected a region, the related information will be referred to server for processing. The ASP.NET is responsible to read the data from database, to return the querying result and to transform them into XML standard as follows: Figure 7

Figure 7: Returned (part of) result expressed in XML standard

4. Implementation and applications

4.1 Project background

Under the influence or the voice of spatial information sharing gradually raising, a province level 'spatial clear house' was supported and proposed by the Gaungdong government in 2001. During the planning procedure of the project, a pungent issue was what should be the platform of information sharing and if we need a public platform for sharing spatial information. The answer was clear but what will be the suitable developing tool or solution. Finally, it was decided to use new generation web publishing standard - XML and its applications such as GML, SVG, XSLT with combination of other developing tools like Java Script, C ++Builder, Asp.Net and Web Service etc as the system needs an open standard developing language.

4.2 Project background

The general structure of 'spatial clear house' of Guangdong province is shown in Figure 8 , it was consulted the structure of National 'spatial clear house'. Each node of the structure is designed for spatial data provider to implement and to maintain the system with similar functions like distributed spatial metadata management sub-system, metadata querying and indexing sub-system, spatial information querying and browsing sub-system, spatial information security management sub-system, spatial data processing tools, spatial data publishing sub-system and individual spatial thematic database. The central node of the spatial clear house is managed by a spatial information service system, which is a concentrative management system with full functions mentioned above and also included other three subsystems such as node management modular of metadata management system, spatial data transforming, and spatial information sharing and processing. All the main functions are shown in Figure 9

4.3 Implementing procedure and Applications

Being one of future tendency in internet development, this paper was not only discussed the methods and working flow but also tried to give some components of the spatial information service system with a case study of Guangdong Spatial Information 'Clearing House'. Up to now, it was only created a friendly and conveniently interactive environment with SVG + JavaScript for querying spatial information to the users. The results were included dynamic publishing the ecological environment, restored forestry planning, real estate information publishing and dynamic meteorology information publishing etc.

The system was accomplished some general functions of WebGIS including zooming in and out, map roaming, attributes querying, rectangle querying, dynamic playing the attributes of all the polygons in the region, and dynamic making charts of map related attributes etc.

Figure 8: Planning and Designing Structure of the Clearing House

Figure 9: the main function of spatial information service system

4.3.1 Map zooming in or out

Using SVG format maps, the system can just use the DOM itself to execute a zooming process with selected numbers. The flow chart is showed in Figure 10

Figure 10: Working flow of map zooming

4.3.2 Map roaming

Map roaming is executed by dragging rectangle view on the map navigation window. It was divided into three events for each dragging action. There are: 1) pushing mouse; 2) moving mouse; 3) loosing mouse. The following is the whole flow chart Figure 11 and the key coding program of executed map roaming for the three events.

Figure 11: Flow chart of map roaming

4.3.3 Attributes querying

The function was implemented two kind of queries: one is to inquire about the selected attributes; another is to inquire about the attributes via rectangle querying window on the map.

1. Information querying (according to the selected attribute to query which polygon fits the condition)
   The file is regarded as the tree structure in a SVG DOM, the program can execute various operations to one node obtained of the tree such as adding, deleting, editing and updating any attribute or event. Searching was used to execute for the whole tree of each sub-tree layer by layer in the program. The obtained attributes of each node were compared and matched with user inputting data if it fits, the region name and ID of the node will be saved preparing to display the result.
   The key coding of the method is provided in appendix 2. Finally, the sub-document embedding in html was used to display the searching results.
2. rectangle querying
   This means that user can drag a rectangle frame and displayed the selected region on the map. In order to execute the function, a transparency layer assigned as 0 was inserted in original SVG file. When user is dragged the frame, it is recorded the up left position, width and height of the rectangle. Then, it is judged which and how many fallen centroids in the rectangle region, and added them in the result dataset and highlighted the selected region. The executing codes are provided in appendix 3.

4.3.4 Graphics interactive operation

One of the main features of SVG graphics is its strong ability of interactive operation through defining the selected events including outmousemove(), onmousemove() and Onclick() etc.

Therefore, three events were defined to execute the interactive operations with maps, one is "moving a mouse in a selected region or polygon"; next one is "moving the mouse out of the selected region or polygon"; last one is a "single click mouse".

Here is only given an example of "moving a mouse in a selected region or polygon":

When the mouse was moved into a selected polygon in SVG document, ' onmouseup' event was activated and the information (attributes) related to the polygon were highlighted and displayed to the users with processing the function. Appendix 4 is the coding form: ( show ( position ) is a processing function of 'onmouseup' event, here, position is defined to be a SysID number of selected region.

4.3.5 Layer controlling

Because SVG is based on XML in which document structure managed by DOM , it is convenient to implement a layer management. The group g object can manage all related graphics such as 'childNodes' attributes in node can obtain all data set of sub-nodes; getElementsByTagName() method can get a list of the selected type objects; if all the 'path' objects under a group <g> are selected, getElementsByTagName("path") can be used to aggregate and get them. In the system, <g> object was used to control layer management function. The various layer objects were included in different group. Through setting group attributes, many functions can be implemented such as visibility, colors and transparency settings and object operations like selected and deleted etc. Style attributes of the objects in SVG document were provided with the inheritance characteristics, subclasses inherit the style attributes of upper class even it has no its own. Analogically, it can reach to top class. For instance, if a layer is assigned a displaying transparency, then its subclasses will all inherited this transparency except a new transparence attribute assigned to a lower classes.

4.3.6 Color rendering

According to the color filling theory and method, four different colors are enough to render any map and to avoid the repeated colors with neighboring polygons. But the method was used in the system is based on the scaling standards and orders of a certain attribute. The standards were divided the classes, in which the numbers of the classes depend on user's option, into average intervals and orders and assigned same color to each class. For instance, if a filled color wants to be changed, user can just implement:

Svgobj.setAttribute("fill","color");

Here 'color' is the value that need to be defined to change or to assign colors.

5. Conclusion

The main conclusion is the following: our work shows that it is possible to use the combined techniques with the new generation of Web publishing standard language --- XML Schema + GML + SVG, Java Script, Asp.Net and C ++ Builder for establishing a regional level "clear house". It was designed for five layers of the software architecture and XML and its applications play an important role in the spatial information service system developing procedure (the executed results are showed in presentation). But beside the advantages of these methods some negative points have occurred:

1) Advantages

Based on XML-SVG, the dynamic publishing a vector data is become more efficient approach to deliver the graphics with multi-temporal information in Web environment;

The graphic interactive operation can help users to implement various operations such as moving, rotating, changing color, editing and deleting path with SVG data on the Website;

The spatial data-management can be done in DBMS. The import of the data into DBMS is executable procedure, and data warehouse is a good solution to the spatial information service system as a data supporting platform;

From the case studies of dynamic publishing the ecological environment, restored forestry planning, real estate information publishing and dynamic meteorology information publishing etc., XML based solution can provide a public spatial information software platform which has benefits including crossing platform, sharing and more efficient using spatial information.

2) Disadvantages

XSL-transformations are sometimes not very fast with a large attribute dataset. If the XSLT-stylesheets are optimized, the performance is acceptable. Of course the performance also depends strongly on the client and server-hardware.

Also SVG is enable Web documents to be smaller, faster and more interactive but SVG is quite slow when it has to read and deliver the static parts of the map server (real map datasets of SVG documents, XHTML-pages, images etc.) with a large dataset. To avoid this performance problem the static parts should be delivered from visualizing database directly but this is still unredeemed.

6. Appendixes

Appendix 1 Bold words are the explanations: 

// coding for dragging navigation window 

function beginPan(evt) 

{ 

OverMapPress=1; // set press button 

width = parseFloat(OverMapRect.getAttribute("width")); // obtain height and width of rectangle 

height = parseFloat(OverMapRect.getAttribute("height")); 

evtX = parseFloat(evt.getClientX()); // obtain x,y values of current object 

evtY = parseFloat(evt.getClientY()); 

rectUlXCorner = parseFloat(OverMapRect.getAttribute("x")); // obtain coordinate of up-left corner for current rectangle 

rectUlYCorner = parseFloat(OverMapRect.getAttribute("y")); 

} 

function doPan(evt) 

{ 

OverViewWidth=158; 

OverViewHeight=200; 

if(OverMapPress==1) 

{ 

newEvtX=parseFloat(evt.getClientX()); 

newEvtY=parseFloat(evt.getClientY()); 

toMoveX= rectUlXCorner+(newEvtX-evtX)*allWidth/OverViewWidth; 

toMoveY= rectUlYCorner+(newEvtY-evtY)*allHeight/OverViewHeight; 

// To keep the rectangle within bounds of navigation window 

if (toMoveX < xOriginCorner) { 

OverMapRect.setAttribute("x",xOriginCorner); 

} 

else if ((toMoveX + width) > (xOriginCorner + allWidth)) { 

OverMapRect.setAttribute("x",xOriginCorner + allWidth - width); 

} 

else { 

OverMapRect.setAttribute("x",toMoveX); 

} 

if (toMoveY < yOriginCorner) { 

OverMapRect.setAttribute("y",yOriginCorner); 

} 

else if ((toMoveY + height) > (yOriginCorner + allHeight)) { 

OverMapRect.setAttribute("y",yOriginCorner + allHeight - height); 

} 

else { 

OverMapRect.setAttribute("y",toMoveY); 

} 

evtX = newEvtX; 

evtY = newEvtY; 

rectUlXCorner = parseFloat(OverMapRect.getAttribute("x")); 

rectUlYCorner = parseFloat(OverMapRect.getAttribute("y")); 

} 

} 

function endPan(evt) 

{ 

window.status = "panning map - please be patient ..."; 

OverMapPress=0; // set loosing mouse ; 

//set viewport of main map 

xulcorner = parseFloat(OverMapRect.getAttribute("x")); 

yulcorner = parseFloat(OverMapRect.getAttribute("y")); 

width = parseFloat(OverMapRect.getAttribute("width")); 

height = parseFloat(OverMapRect.getAttribute("height")); 

newViewport = xulcorner + " " + yulcorner + " " + width + " " + height; 

MainMapViewPort.setAttribute("viewBox",newViewport); 

window.status = "... done"; 

} 

Appendix 2 Bold words are the explanations: 

SearchValue=parseFloat(SearchValue); 

if(SearchType==2) 

{ 

if(SearchValue<2||SearchValue>113) 

{ 

window.alert(" queried ID out of bound "); 

return; 

} 

} 

foundArray=new Array(); 

switch(SearchWay) 

{ 

case 0: 

{ 

// user selected ( >) for querying 

for(iCount=1;iCount<((SvgObj1.length)-1);iCount+=2) 

{ 

SVGSEARCHED=(parseFloat((SvgObj1.item(iCount).getAttribute(SearchName)))); 

if(SearchValue<SVGSEARCHED) 

{ 

temp=SvgObj1.item(iCount).getAttribute('CTY_CODE'); 

temp="attribute"+temp; 

temp=eval(temp); 

nameArray[k]=(temp)[0]; 

foundArray[k]=iCount; 

k++; 

} 

} 

break; 

} 

case 1: 

{ 

// user selected ( =) for querying 

for(iCount=1;iCount<((SvgObj1.length)-1);iCount+=2) 

{ 

SVGSEARCHED=(parseFloat((SvgObj1.item(iCount).getAttribute(SearchName)))); 

if(SearchValue==SVGSEARCHED) 

{ 

temp=SvgObj1.item(iCount).getAttribute('CTY_CODE'); 

temp="attribute"+temp; 

temp=eval(temp); 

nameArray[k]=(temp)[0]; 

foundArray[k]=iCount; 

k++; 

} 

} 

break; 

} 

case 2 : 

{ 

// user selected (<) for querying 

for(iCount=1;iCount<((SvgObj1.length)-1);iCount+=2) 

{ 

SVGSEARCHED=(parseFloat((SvgObj1.item(iCount).getAttribute(SearchName)))); 

if(SearchValue>SVGSEARCHED) 

{ 

temp=SvgObj1.item(iCount).getAttribute('CTY_CODE'); 

temp="attribute"+temp; 

temp=eval(temp); 

nameArray[k]=(temp)[0]; 

foundArray[k]=iCount; 

k++; 

} 

} 

break; 

} 

default : 

{ 

window.alert(" select a querying method "); 

return ; 

} 

} 

if(foundArray.length==0) 

{ 

alert(" no fitting areas in selected conditions "); 

return; 

} 

Appendix 3 Bold words are the explanations: 

function beginPan1(evt) // The processing function of onmousedown event when use rectangle query 

{ 

//xpos , ypos , widthpos , heightpos four parameters of viewBox for coordinate transformation 

xpos=parseFloat(getstring(MainMapViewPort.getAttribute('viewBox'),"1")); 

ypos=parseFloat(getstring(MainMapViewPort.getAttribute('viewBox'),"2")); 

widthpos=parseFloat(getstring(MainMapViewPort.getAttribute('viewBox'),"3")); 

heightpos=parseFloat(getstring(MainMapViewPort.getAttribute('viewBox'),"4")); 

pressed1=1; // judging if it is a rectangle query 

objet=SvgMainMapDoc.getElementById("dragRect"); 

// obtain the position of mouse and set the up left x,y position, height and width coordinates of the rectangle 

x=evt.getClientX(); 

y=evt.getClientY(); 

objet.setAttribute("x",x*widthpos/600+xpos); 

objet.setAttribute("y",y*heightpos/457+ypos); 

objet.setAttribute("width",'0'); 

objet.setAttribute("height",'0'); 

} 

function doPan1(evt)// The processing function of onmousemove event when use rectangle query 

{ 

if(pressed1==1) 

{ 

xpos=parseFloat(getstring(MainMapViewPort.getAttribute('viewBox'),"1")); 

ypos=parseFloat(getstring(MainMapViewPort.getAttribute('viewBox'),"2")); 

widthpos=parseFloat(getstring(MainMapViewPort.getAttribute('viewBox'),"3")); 

heightpos=parseFloat(getstring(MainMapViewPort.getAttribute('viewBox'),"4")); 

objet=SvgMainMapDoc.getElementById("dragRect"); 

objet.setAttribute("width",(evt.getClientX()-x)*widthpos/600); 

objet.setAttribute("height",(evt.getClientY()-y)*heightpos/457); 

} 

} 

function endPan1(evt)// The processing function of onmouseup event when use rectangle query 

{ 

pressed1=0; 

xpos=parseFloat(getstring(MainMapViewPort.getAttribute('viewBox'),"1")); 

ypos=parseFloat(getstring(MainMapViewPort.getAttribute('viewBox'),"2")); 

widthpos=parseFloat(getstring(MainMapViewPort.getAttribute('viewBox'),"3")); 

heightpos=parseFloat(getstring(MainMapViewPort.getAttribute('viewBox'),"4")); 

var x1,y1,w1,h1; // variables of up left x,y coordinate of rectangle and width and height 

objet=SvgMainMapDoc.getElementById("dragRect"); 

objet.setAttribute("stroke-width",500000*100/current_scale); 

// four cases of different coordinates for implementing onmousedown and onmouseup with rectangle query 

if((evt.getClientX()-x>0)and(evt.getClientY()-y>0)) 

{ 

xrectcenter=x/2+evt.getClientX()/2; 

yrectcenter=y/2+evt.getClientY()/2; 

objet.setAttribute("width",(evt.getClientX()-x)*widthpos/600); 

objet.setAttribute("height",(evt.getClientY()-y)*heightpos/457); 

x1=x*widthpos/600+xpos; 

y1=y*heightpos/457+ypos; 

w1=(evt.getClientX()-x)*widthpos/600; 

h1=(evt.getClientY()-y)*heightpos/457; 

} 

if((evt.getClientX()-x>0)and(evt.getClientY()-y<0)) 

{ 

xrectcenter=x/2+evt.getClientX()/2; 

yrectcenter=y*3/2-evt.getClientY()/2; 

objet.setAttribute("x",x*widthpos/600+xpos); 

objet.setAttribute("y",(evt.getClientY())*heightpos/457+ypos); 

objet.setAttribute("width",(evt.getClientX()-x)*widthpos/600); 

objet.setAttribute("height",(y-evt.getClientY())*heightpos/457); 

x1=x*widthpos/600+xpos; 

y1=(evt.getClientY())*heightpos/457+ypos; 

w1=(evt.getClientX()-x)*widthpos/600; 

h1=(y-evt.getClientY())*heightpos/457; 

} 

if((evt.getClientX()-x<0)and(evt.getClientY()-y>0)) 

{ 

xrectcenter=x*3/2-evt.getClientX()/2; 

yrectcenter=y/2+evt.getClientY()/2; 

objet.setAttribute("x",(evt.getClientX())*widthpos/600+xpos); 

objet.setAttribute("y",y*heightpos/457+ypos); 

objet.setAttribute("width",(x-evt.getClientX())*widthpos/600); 

objet.setAttribute("height",(evt.getClientY()-y)*heightpos/457); 

x1=(evt.getClientX())*widthpos/600+xpos; 

y1=y*heightpos/457+ypos; 

w1=(x-evt.getClientX())*widthpos/600; 

h1=(evt.getClientY()-y)*heightpos/457; 

} 

if((evt.getClientX()-x<0)and(evt.getClientY()-y<0)) 

{ 

xrectcenter=x*3/2-evt.getClientX()/2; 

yrectcenter=y*3/2-evt.getClientY()/2; 

objet.setAttribute("x",(evt.getClientX())*widthpos/600+xpos); 

objet.setAttribute("y",(evt.getClientY())*heightpos/457+ypos); 

objet.setAttribute("width",(x-evt.getClientX())*widthpos/600); 

objet.setAttribute("height",(y-evt.getClientY())*heightpos/457); 

x1=(evt.getClientX())*widthpos/600+xpos; 

y1=(evt.getClientY())*heightpos/457+ypos; 

w1=(x-evt.getClientX())*widthpos/600; 

h1=(y-evt.getClientY())*heightpos/457; 

} 

if(isquery==1) 

{ 

result_number=0; 

var node0=SvgMainMapDoc.getElementById('bndcodeok2.pat'); 

var path0=node0.childNodes; 

var node=SvgMainMapDoc.getElementById('LAB_x0020__x0020_3'); 

var path1=node.childNodes; 

nombre=path1.length; 

unfillmap();// clearing former highlight rengion 

k=1; 

// judging if every centroid in the region is selected and put the related information in the dataset 

while (k<nombre) 

{ 

object=path1.item(k); 

posx=parseFloat(object.getAttribute("cx")); 

posy=parseFloat(object.getAttribute("cy")); 

posy=posy*(-1)+603236.547013678 ; 

if(in_rect(x1,y1,w1,h1,posx,posy)) 

{ 

temp=path0.item(k).getAttribute('CTY_CODE'); 

temp="attribute"+temp; 

temp=eval(temp); 

nameArray[result_number]=(temp)[0]; 

foundArray[result_number]=k; 

result_number=result_number+1; 

} 

k=k+2; 

} 

if(foundArray.length==0) 

{ 

alert(" no satisfied region "); 

return; 

} 

Texta = ' following is the searched results : <form name="ergForm"> <select name="liste" size=12 MULTIPLE> </select></form>'; 

document.all.ergebnisse.innerHTML = Texta; 

for(j = 0; j < result_number; j++) 

{ 

NeuerEintrag = new Option(nameArray[j]); 

document.all.ergForm.liste.options[j] = NeuerEintrag; 

} 

ergLaenge = document.all.ergForm.liste.length; 

isquery=0; 

showall(result_number); 

showaa=SvgMainMapDoc.getElementById("show11"); 

SvgStyle1=showaa.getStyle(); 

SvgStyle1.setProperty('visibility','hidden'); 

} 

} 

function out()// The processing function of onmouseout event when use rectangle query 

{ 

pressed1=0; 

Appendix 4 Bold words are the explanations: 

function show(position) 

{ 

if(RectPress!=1) // not rectangle querying 

{ 

var SvgObj1; 

var SvgObj2; 

var SvgStyle; 

position=2*position-3; 

SvgObj1=SvgObj.getChildNodes(); // obtain DOM of the document 

SvgObj2=SvgObj1.item(position); 

SvgStyle=SvgObj2.getStyle(); 

SvgStyle.setProperty("fill","black"); // set attributes to implement a color interactive operation 

// Scripting to display the attribute of the objects in document 

var str_Area=SvgObj2.getAttribute("AREA"); 

str_Area="Area :"+str_Area; 

var str_Perimeter=SvgObj2.getAttribute("PERIMETER"); 

str_Perimeter="Perimeter :"+str_Perimeter; 

var str_SysID=SvgObj2.getAttribute("SysID"); 

str_SysID="SysID :"+str_SysID; 

var str_COUNTY_NAME=SvgObj2.getAttribute("COUNTY_NAME"); 

str_COUNTY_NAME="CITY_NAME:"+str_COUNTY_NAME; 

var SvgInfo; 

SvgInfo=svgfile3.getSVGDocument(); 

TextObj1=SvgInfo.getElementById("area"); 

textNode=TextObj1.getFirstChild(); 

textNode.setData(str_Area); 

TextObj1=SvgInfo.getElementById("perimeter"); 

textNode=TextObj1.getFirstChild(); 

textNode.setData(str_Perimeter); 

TextObj1=SvgInfo.getElementById("sysid"); 

textNode=TextObj1.getFirstChild(); 

textNode.setData(str_SysID); 

TextObj1=SvgInfo.getElementById("COUNTY_NAME"); 

textNode=TextObj1.getFirstChild(); 

textNode.setData(str_COUNTY_NAME); 

} 

} 
          
          
          

Footnotes

1. http://www.w3.org/TR/2001/PR-xmlschema-1-20010330/#ref-xmlinfo

Bibliography

[1]

1, Don Box, Aaron Skonnard, John Lam, Essential XML, Addison Wesley Longman, Inc, 2001

[2]

2,J. David Eisenberg, SVG Essentials, Fifth edition, Feb.2002, Publisher:O'Reilly.

[3]

,Simon Cox, Paul Daisey, Ron Lake, Clemens Portele, Arliss Whiteside,GML Implementation Specification. version 3.00, 2003-01-29, Open GIS.

[4]

4,Ronald Bourret, XML and Databases. last update July, 2004

[5]

5,XSL Transformations (XSLT) Version 1.0. (http://www.w3.org/TR/xslt)

[6]

6,Michael H. Kay,What kind of language is XSLT-An analysis and overview. February2001(http://www-900.ibm.com/developerWorks/cn/xml/x-xslt/index_eng.shtml)

[7]

7, LI Minglu, CAO Jian.Applied integration technique based on Web Service. (http://www.iturls.com) , 2002

[8]

8, CAI Xiaolu, LIANG Yuqi, techniques,architecture and applications of Web Service. Beijing: electronic industry press, 2003.

[9]

9, uzyk R. EAI Journal ,Web Service::Standardizing EAI. 2002.23

[10]

W10,ammer K. EAI Journal ,Web Service and Enterprise Integration. 2001.12

[11]

11,KREGER H. Web Services Conceptual Architecture[EB/OL].Web Services Conceptual Architecture. http://www-4.ibm.com/software/solution/webservices/pdf/WSCA.pdf, 2001-02.