Design and Implement a Cartographic Client Application For Mobile Devices using SVG Tiny and J2ME Hui L. *a, Behr F.-J. **b, Schröder D.c Eschenauer Str. 39, D-70437 Stuttgart b, c University of Applied Sciences Stuttgart, Department of Geomatics, Computer Science and Mathematics, Schellingstraße 24, D-70174 Stuttgart a
Abstract The dissemination of digital geospatial data is available now on mobile devices such as PDAs (personal digital assistants) and smart-phones etc. The mobile devices which support J2ME (Java 2 Micro Edition) offer users and developers one open interface, which they can use to develop or download the software according their own demands. Currently WMS (Web Map Service) can afford not only traditional raster image, but also the vector image. SVGT (Scalable Vector Graphics Tiny) is one subset of SVG (Scalable Vector Graphics) and because of its precise vector information, original styling and small file size, SVGT format is fitting well for the geographic mapping purpose, especially for the mobile devices which has bandwidth net connection limitation. This paper describes the development of a cartographic client for the mobile devices, using SVGT and J2ME technology. Mobile device will be simulated on the desktop computer for a series of testing with WMS, for example, send request and get the responding data from WMS and then display both vector and raster format image. Analyzing and designing of System structure such as user interface and code structure are discussed, the limitation of mobile device should be taken into consideration for this applications. The parsing of XML document which is received from WMS after the GetCapabilities request and the visual realization of SVGT and PNG (Portable Network Graphics) image are important issues in codes’ writing. At last the client was tested on Nokia S40/60 mobile phone successfully. Keywords: Cartographic visualization, J2ME, SVG, SVGT, WMS, Mobile cartography, Scalable Vector Graphics Tiny, Web Map Service, XML parser, Java 2 Micro Edition
1 3.1
Introduction
Background
In the nineties, Web maps and digital maps became popular due to the success of the Personal Computers and the Internet. Now the popularity of mobile devices such as PDA's, mobile phones etc. and the availability of development environments such as J2ME (Java 2 Micro Edition) for such devices have made possible to design and develop of new kind of cartographic client software. No doubt that in the future cartographic data is not PC centric but would be available on mobile systems. But the map display on a handheld device is a challenge to cartography due to the limiting factors such as screen size, colors, resolution, processing power, memory and power supply. J2ME was born to help solving such problems. In the earlier years, the Web Map Service (WMS) was mostly based on raster image format. Due to big size and limited bandwidth, the raster image format is also one obstacle to the data transforming from PC to mobile device. But after the birth of vector image formats, new possibilities emerged. Mostly remarkable is the Scalable Vector Graphics (SVG) recommendation, an open standard for encoding geographic information in a XML language defined by W3C (World Wide Web Consortium). As one subset of SVG, Scalable Vector Graphics Tiny (SVGT) is not related to any specific hardware or software platform: data encoded using it can be easily read and understood by any programming language and software system able to parse XML streams. SVGT encodes vector geographical information together with metadata on spatial and non-spatial resources. *
[email protected]; phone: (+49) 17621934010
[email protected] ; phone (+49) 711/8926-2693,; fax: (+49) 711/8926-2556
**
3.2
Problem definition
During the designing, the following problems should be determined and solved. -Limitation of mobile devices: Cartographic visualization for small displays of mobile devices is restricted by several technical limitations such as the small display size and resolution, lack of processing power and memory, most critical the battery life, and the mobile network bandwidth. -XML document parsing: Once the users send the GetCapabilities Request to the WMS, the client gets a XML format file as the responded data. How to parse this XML document? -SVGT/PNG Viewer using and designing: How to display the SVGT and PNG raster image result map file? -User interface designing: This client should be designed as one complete WMS client with full functions that are same as the PC client. Thus it should include several basic interfaces, for example, selecting server address and inputting coordinate of the interest point, etc.
2 2.1
Background
Web Map Service
Web Map Service is an International Standard1 (ISO 19128: 2005 Geographic information - Web map server interface) which defines a "map" to be a portrayal of geographic information as a digital image file suitable for display on a computer screen. WMS-produced maps are generally rendered in a pictorial format such as PNG, GIF or JPEG, or occasionally as vector-based graphical elements in SVG or Web Computer Graphics Metafile (WebCGM) formats. An OGC compliant WMS applies to three different requests: GetCapabilities, GetMap and GetFeatureInfo. GetCapabilities and GetMap requests are mandatory, GetFeatureInfo is an optional request and it will not be discussed here. Each server that follows the WMS specification has to provide the interface to the users to input the standard parameters and if these parameters are valid the server must serve the data corresponding to the request. The methods to send the request from a client to a server are various. If the client is a browser or mobile device, the parameters are sent inside the Uniform Resource Locator (URL). For GetCapabilities request, if the parameters are inputted correctly, the service-level metadata in form of XML document will be returned, including the information about the image formats and layers which are available in the server, the corresponding coordinates system names, the bounding box value for each coordinates system, the map formats and the contact person and so on. The parameters of the GetCapabilities request are shown in Table 1: Request Parameter
Mandatory/Optional
Description
VERSION=version SERVICE=WMS
O M
Request version Service type
REQUEST=GetCapabilities
M
Request name
FORMAT=MIME_type
O
Output format of service metadata
UPDATESEQUENCE=string
O
Sequence number or string for cache control
Tab. 1: The parameters are required by the GetCapabilities request (OGC (2006))
A valid GetCapabilities request should include all the parameters specified as mandatory in Table 1. The format of GetCapabilities request in a URL likes this:
1
http://www.opengeospatial.org/docs/01-068r2.pdf
http://www.gis-news.de/wms/getmapcap.php?VERSION=1.1.1&SERVICE=WMS&REQUEST=GetCapabilities Listing 1: The format of GetCapabilities request in a URL
The response of the GetCapabilities request is a XML format document. image/svgt+xml image/png image/pdf Listing 2: The fragment of the result XML file of GetCapabilities request showed in browser
In the next step, the user selects the value of the parameters of GetMap request depending on the information from the GetCapabilities result. In this case, image/svgt+xml means that one available map format on this server is SVGT The parameters of a GetMap request are shown in Table 2: Request Parameter VERSION=1.3.0 REQUEST=GetMap LAYERS=layer_list
Mandatory Optional M M M
Description
Request version Request name Comma-separated list of one or more map layers Comma-separated list of one rendering style per requested STYLES=style_list M layer CRS=namespace:identifier M Coordinate reference system Bounding box corners (lower left, upper right) in CRS BBOX=minx,miny,maxx,maxy M units WIDTH=output_width M Width in pixels of map picture HEIGHT=output_height M Height in pixels of map picture FORMAT=output_format M Output format of map TRANSPARENT=TRUE|FALSE O Background transparency of map (default=FALSE) red-green-blue color value for the background color BGCOLOR=color_value O (default=0xFFFFFF) The format in which exceptions are to be reported by the EXCEPTIONS=exception_format O WMS (default=XML) TIME=time O Time value of layer desired ELEVATION=elevation O Elevation of layer desired Tab. 2: The parameters are required by the GetMap request (OGC (2006)) A valid request should include all the mandatory parameters. The format to send GetMap request in URL is like this: http://www.gis-news.de/wms/getmapcap.php?VERSION=1.1.1&BBOX=189775.33,4816305.37,761662.27,54 72414.18&LAYERS=airports,ctybdpy2&STYLES=,,&REQUEST=GetMap&style=&SRS=EPSG:26715&4340& WIDTH=800&HEIGHT=600&FORMAT=image/svg+xml&EXCEPTIONS=application/vnd.ogc.se_xml Listing 3: Example of a GetMap request in a URL
The result of the GetMap request is a vector or raster image map to be displayed in the browser. All the parameters should be picked up from the GetCapabilities XML Document.
2.2
Scalable Vector Graphics Tiny (SVGT)
Because of industry demand, two mobile profiles were introduced with SVG 1.1 (W3C): SVG Tiny (SVGT) and SVG Basic (SVGB). These are subsets of the full SVG standard, mainly intended for user agents with limited capabilities. In particular, SVG Tiny was defined for highly restricted mobile devices such as cellphones, and SVG Basic was defined for higher level mobile devices, such as PDAs. Hence, it was decided that SVG Tiny would be a strict subset of SVG Basic, itself a strict subset of SVG Full. SVGT is an XML format and follows the XML grammar. Some basic graphics components are provided, such as rectangle, circle, ellipse, line, polyline and polygon; the corresponding style parameters are also defined. Furthermore, another command “path” is provided to describe lines and curves between points. Additionally transformations, masking, linking, temporal effects and animation are possible. Vector graphic images are not limited to a single and fixed pixel size. This means SVGT format can be displayed on any device of any size and any resolution without changing the image clarity, contrasting with raster image files, which are difficult to resize without loss of information. When the raster images are zoomed in to large scales, the content of the image becomes blurred. SVGT graphics don’t have such blur problem because of their scalable vector property. There are quite a few available implementations for consuming SVG Tiny content on a mobile device: The first one to mention is TinyLine2, because it's free, and it can be run on a phone that doesn't ship with a built-in SVG implementation. ZOOMON Mobile Solutions, BitFlash were also joining the SVG Working Group and getting work underway toward creating the SVG Mobile specification. In this application, TinyLine is chosen as viewer. 2.4
J2ME
J2ME (SUN) is a lean Java platform targeted specifically at applications running on small devices such as mobile devices, digital television set-top boxes, as well as a broad bound of embedded devices. It supports flexible user interfaces, robust security models, built-in network protocols, and extern support for networked and offline applications. For supporting those different devices, J2ME architecture comprises a variety of configurations, profiles, and optional packages. Implementers and developers can choose from the architecture, and combine to construct a complete Java runtime environment, which closely fits the requirements of a particular series of devices. Each combination is optimized for the memory, processing power, and I/O capabilities of a related category of devices. All embedded devices have been divided into two categories: Connected Limited Device (CLD) and Connected Device and corresponding Configurations (Connected Limited Device Configuration and Connected Device Configuration) are defined as criterion for deploying Java program in those devices. Conforming to the Configurations, Mobile Information Device Profile (MIDP) is a key element of J2ME and supports the platform with user interfaces, persistent storage, network functionality and APIs. All applications for the MIDP must be derived from a special class, MIDlet. The MIDlet class manages the life cycle of those applications and it is located in the package javax. microedition.midlet. A MIDlet can exist in four different states: loaded, active, paused, and destroyed, similar to an Applet. Figure 1 shows the J2ME structure.
2
http://www.tinyline.com
MIDlet MIDP
CLDC Java Virtual Machine Hardware, Operating System Fig. 1: J2ME Structure
2.5
XML Document Parsing
The XML processing model describes the steps that an application should take to process XML; an application which implements such a model is called an XML parser. XML Parsers are traditionally featuring lots of code and heavy runtime memory requirements. In MIDP devices, the memory available is usually small and the code size of applications may have a restriction. There are three fundamental parser types: A model parser reads an entire document at one time and creates a representation of the document in memory and it needs significantly more memory than other types of parsers. A push parser reads through an entire document, and declares the corresponding listener object for various parts of the document. A pull parser reads a little piece of a document step by step and at last through the document by repeatedly requesting the next piece. Which type of parser you choose depends on how you want your application to behave and what types of documents you're expecting to parse. In this application, kXML 2.03 pull parser was used as XML parser. 2.6
Earlier work on cartographic visualization for mobile applications
There are several WMS clients developed by other developers for the mobile devices, which enlighten some good ideas for designing the codes structure and user interfaces of this application. For example, J2ME OGC WMS Client (http://www.skylab-mobilesystems.com) and J2ME Map (http://j2memap.landspurg.net/).
3 3.1
The implementation
Testing server environments
For testing the client, Easywms4 server based on vector and raster image formats was chosen. GetCapabilities and GetMap request could be sent to WMS and got the responding data from WMS. PHPMyWMS5 is an open source based WMS compliant Web Map Server, using PHP technology. In this WMS server, the “getmapcap.php” is the main entrance process page. When the user sends the requests, this page will be called firstly and the parameters inside the URL will be analyzed. The corresponding page or function will be executed. The GetMap request for a SVGT vector image can be called by using URL like this:
3 4 5
http://kxml.objectweb.org/ http://www.easywms.com An Open Source based, SVG oriented Framework for extended Web Map Services -- Behr, F.-J., Hui L
http://phpmywmsdemo.easywms.com/getmapcap.php?VERSION=1.1.1&BBOX=-3959,-3624,3741,3664&LA YERS=streets&STYLES=default&REQUEST=GetMap&style=default&SRS=SRS_not_defined&WIDTH=800& HEIGHT=600&FORMAT=image/svgt+xml&EXCEPTIONS=application%2Fvnd.ogc.se_xml Listing 4: The GetMap request for a SVGT vector image in a URL
3.2
System Structure Analyzing and Designing
The structure of the application is shown in Figure 2 and Figure 3. While users never care about the code except the user interface, programmers have to take care of both aspects. From the users’ point of view the code structure is only dealing with the interface such as a pull-down menu. Firstly the users have the possibility to start the client in their mobile phone, and select the pull-down menu list to operate, and the corresponding dialog appears afterwards (Fig. 6). If the users operate wrongly or the client meets some unexpected errors, for example, users input invalidate coordinate, the process will stop and jump one error alert dialog; if all the inputted parameters are valid and connection is available, SVGT viewer or raster image viewer will be loaded. During the data processing or responding from WMS, one waiting splash will stay, and users can stop the process as they will or if the waiting time last too long time because of the bad Internet connection. Start Splash
Main
About me
Server Add
Point Select
Server Edit
Layer &SRS Select
Wait Splash
Server Delete
Format Select
SVGT Viewer
Help
Raster Image Viewer
Help
Error Fig. 2: Interface structure of the client from the users’ point of view
In the developers’ shoes, the structure is composed of not only the interface, but also several individual classes which will run invisibly. In Figure 3, user interfaces are visualized with boxes with boundaries, and classes are visualized with dashed boxes. In this application fulfils four main issues: 1. Records the data what the users create when they edit, add or delete the server list. 2. Parse the contents of XML file which got from GetCapabilities and GetMap requests from WMS. 3. Validate the result file from WMS after GetMap request, justify the image format to choose which viewer will be loaded. 4. Load the SVGT or PNG image from WMS and display on screen. After users choose the operation of server list to edit, add, delete server, the “RMS” class was called to store the record storage which has been changed. Once the users select one server and ready to connect the server, “Validate the server, and get the WMS Head” class was called to validate the selected server and get the HEAD and Content Type from WMS. After inputting the XY coordinate, GetCapabilities request was send, and “Parse the XML file from WMS” class was called to parse the XML document from WMS, pick up the request parameters from the content of XML document, which are needed to be added in the GetMap request URL.
Once users have set all the needed values of parameters and ready to send the GetMap request, “Send GetMap request, validate the result” and “Justify the image format” classes were called to validate the result file which was got from WMS, if this file is XML Document, these are two possibilities: the first is SVGT file, then begin to load the SVGT Viewer; the second is XML document that contains the errors description from WMS, because the parameters was set in invalidate form before. And if the result file is image, then justifies whether it is PNG format image and loads the raster image viewer, if not, the error dialog class was called, and users can jump back to the former interface they have stayed just now. If any processes mentioned before meet an unexpected error, the error dialog was also called. The code structure from the developers’ point of view: MIDlet Start
Server list Operation
No
Exit
Server select
RMS
Yes
No
Validate the server, get the WMS Head Yes No
Input Coordinate Yes Parse the XML file from WMS Yes
No
No Error Form
Select the SRS and layers Yes
No
Select image format Yes
No
Send GetMapRequest, validate the result Yes Justify the image format Yes SVGT Viewer
Yes Raster Image Viewer
Fig. 3: Code structure of the client from the developers’ point of view
3.3
J2ME Record Management Store (RMS)
The Mobile Information Device Profile -- the platform for mobile Java applications -- provides a mechanism for MIDP applications to persistently store data across multiple invocations. This storage mechanism can be viewed as a simple record-oriented database model and is called the record management system (RMS), through which MIDlets can persistently store data and retrieve it later. J2ME RMS can comprise multiple record stores. Each record store can be visualized as a collection of records, which will remain persistent across multiple invocations of the MIDlet. A record store is created in platform-dependent locations, like nonvolatile device memory, which are not directly exposed to the MIDlets.
Towards with record store, MIDP provides in the package javax.micoredition.rms set of classes and Interfaces called RMS API. The javax.microedition.rms.RecordStore class represents a RMS record store, providing several methods to manage as well as insert, update, and delete records. 3.4
KXML XML Parser
The XML parser used in this application is kXML 2.0. In order to make kXML classes available to the application, kxml2-src.zip package from the kXML site needs to be downloaded and intergrated into the development enviroment. As described before, the GetCapabilities XML document should be parsed. Here is one section of this XML document in Listing 5. OGC:WMS Open Source Map Server Listing 5: One section of the GetCapabilities XML document
In order to capture data from WMS, the application should open a URL connection and get the GetCapabilities XML data as an InputStream. The InputStream is made available to the XMLParser through an InputStreamReader. This is illustrated in Listing 6. HttpConnection hc = (HttpConnection)Connector.open(url); InputStream is = hc.openInputStream(); Reader reader = new InputStreamReader(is); KXmlParser parser = new KXmlParser(); parser.setInput( reader); Listing 6: Get the GetCapabilities XML data from WMS
When the XML Parser's read() method encounters an item, such as the event name (tag name), and read a certain element, its content is extracted from the text node below the element being evaluated. In Listing 8, the parser finds child elements of the Service element. After having found the Title element the value of its text node is extracted which finally appears in the user interface (Figure 5). if (parser.getName().equals("Service")) { String wmstitle = null; parser.require(XmlPullParser.START_TAG, null, null); if (name.equals("Title")) wmstitle = parser.nextText(); parser.require(XmlPullParser.END_TAG, null, name); Listing 7: Picking up WMS title from GetCapabilities XML data
The title of WMS will be extracted and be displayed on the screen, see Figure 5.
Fig. 4: Display the WMS title
3.5
Raster Image Displaying
As described before, PNG is the image format mostly used in mobile device application. In J2ME, the Graphics class provides a method for drawing images, static images as well as non-static images. Static image can not be modified after been created; non-static images are drawn by the J2ME drawing function. Because the limited process speed and
memory, the PNG map should be created in form of static image. The static image can be created based on the binary PNG data received. Image img=Image.createImage(byte[], int offset, int length); Listing 8: Create static image though binary PNG format.
The PNG image data is read though the data stream from WMS, putting into a byte buffer. Afterwards the image is rendered on the screen according to the byte data.
4 4.1
Results
Usability testing
Usability testing was performed during and after the implementation using emulation software as well on a real mobile devices, sending request to a PHPMyWMS server. The following are the resulting SVGT vector image map and PNG raster image map in browser:
Fig. 5: GetMap request result SVGT vector image and PNG raster map in browser
4.1.1
Test with SVGT image WMS Server
Load the client and choose one vector image based WMS, and connect to it. The wait splash displays during the connection. In the Input the X and Y coordinate please Form point coordinate was inputted and then connect to WMS again to send GetCapabilities request, and the wait splash displays also during the process. The information below the Form is server software and content type information of WMS. In Form Select layers please, select SRS and layers with the same SRS. See next Figures.
Fig. 6: Connect WMS, wait splash, input coordinate and WMS information, Select SRS and layers
Then select the image format in Form Select image’s format please, and go on to load the SVGT map. If parameters were inputted wrongly before, error dialog will be displayed. For example, if you select SRS EPSG: 31468, but select the layer streets with different SRS SRS_not_defined, the error message will appear as following: LayerNotDefined Layer streets with SRS EPSG: 31468 not found. Please check your layer name and/or SRS. The layers supported by this SRS EPSG: 31468 are. If all the parameters are valid, the SVGT map will be displayed. The users can use Pan function to move the map, and Zoom function to zoom in or out. See next Figures.
Fig. 7:, Select SVGT image format, Error dialog, Move SVG map, Zoom in or out
Function Orig View is for retrieveing the original map view and the image quality of SVG map can be reset. If the users are not clear about the operation, Help function can show all the operation description. If PNG format was selected in Form Select image’s format please, the client will load the PNG image viewer. Pan function can be used to move the map, and Zoom function is for zooming in or out. Orig View function can be used for view the original map. See next Figures.
Fig. 8: View original map, Select PNG image format, Move SVG map, View original map
4.1.2
Test with Mobile Phone
Mobile phone Nokia 6230i with S40 and 6630 with S60 were chosen for the testing. The following are the interfaces of client in Nokia 6230i. See next Figures.
Fig. 9: Test with Nokia 6230i
5 5.1.1
Conclusion
Advantage
Web map server has been well developed, both theoretically and practically. The standard map formats of web map server are raster based, but SVG format is newly integrated in digital cartography and begin to be supported by more and more WMS. This client can not only display the traditional raster image format PNG, but also the SVGT (SVG and SVGB also) format image. It has the capability to parse mostly of the GetCapabilities Requests XML document responded from WMS, which follow the OGC WMS 1.1.1 (or 1.1.0) Implementation Specification and have the very similar DTD6 (Document Type Definition). The client can be seen as one common solution of WMS client points to the mobile devices. 5.1.2
Outlook
This thesis work designed and implemented one WMS client for the mobile device. Currently the function is working well, and some advanced improvements can be performed if the work could be continued. 5.1.2.1
Capability to parse all GetCapabilities Request XML Document
Currently the client can parse most of the GetCapabilities Requests XML documents received from WMS servers, which follow the OGC WMS 1.1.1 or 1.1.0 Implementation Specification having a very similar DTD. That means if one WMS uses DTD that very different from the standard, the parser will stop parsing and throws an exception. For example, the following two examples show the same element of two different XML document. WMS_XML INIMAGE
Listing 9: The Exception element content in XML content
It can easily be recognized that the XML fragments are different; the second example is erroneous.
6
A Document Type Definition defines the legal building blocks of an XML document. It defines the document structure with a list of legal elements.
5.1.2.2
Dynamically load the image
Current application can display the area that users select, but if the users pan it and the screen boundary encroaches the view box boundary of the image, the map outside of the view box boundary can not be displayed dynamically. For raster image, preload image as byte array can solve the problem. The whole raster image could be read firstly and stored as byte array in memory of the mobile devices. Each part of image has its own corresponding section in the byte array in one sequence. If the image moves outside of view box boundary, one part byte array that present the outside image is loaded from the whole array, and such byte array is rendered to new outside image. 5.1.2.3
LBS/GPS Functions
If LBS or GPS functionality is added to the client, it will be possible to determine the location. For LBS function developing, the client can use the Location API for J2ME (JSR 179), a set of generic APIs that can be used for developing location-based services. This API defines an optional package, javax.microedition.location, which enables developers to write wireless location-based applications and services for resource-limited devices like mobile phones, and provides mobile applications with information about the device's present physical location and orientation (compass direction). For Location API and GPS receiver, location can be expressed in the widely used latitude-longitude-altitude coordinate system. After got the coordinate of one location, the latitude-longitude-altitude coordinate should be converted to North-East (X, Y) Coordinates, such as UTM (Universal Transverse Mercator), using some complex calculation coordinate transformation.
References 1. 2. 3.
OGC (2006): OpenGIS Web Map Service WMS Implementation Specification. http://www.opengeospatial.org/docs/01-068r2.pdf. Accessed on 15.12.2005. Kim Topley (2002): J2ME in a Nutshell. Publisher: O'Reilly ISBN: 0-596-00253-X, 478 pages W3C (2006): Mobile SVG Profiles: SVG Tiny and SVG Basic http://www.w3.org/TR/SVGMobile/
4.
Rajinder Singh Nagi (2004): Cartographic visualization for mobile applications. Master Thesis, International Institute for Geo-information Science and Earth Observation, India.
5.
Shuichi TAKINO (2001): GIS ON THE FLY.
6.
Sun Yundong, Liu Changzheng, Gu Ming (2003): LBS implement using Java and WebServices. University, China.
7.
Naveen Balani (2004): Using kXML to access XML files on J2ME devicesTechnical document, ibm.com/developerWorks
8.
IBM (2006a): Add XML parsing to your J2ME applications http://www-128.ibm.com/developerworks/library/wi-parsexml/
9.
IBM (2006b): Combine J2ME applications with WMS http://www-128.ibm.com/developerworks/cn/webservices/ws-javamobile/index.html?ca=dwcn-newsletter-webservi ces
Thesis, International Symposium on Asia GIS 2001, Japan. Thesis, Qinghua
10. SUN (2006a): Parsing XML in J2ME http://developers.sun.com/techtopics/mobility/midp/articles/parsingxml/ 11. SUN(2006b): Java 2 Platform, Micro Edition (J2ME) http://java.sun.com/j2me
