PREVIOUS   NEXT   CONTENTS   HOME 

4. The Sikyon Interactive Image

4.1 Scalable Vector Graphics

Rather than implementing one of the finished GIS solutions, developing an interactive image from scratch was pursued. Using widely accepted technologies, the prototype of a GIS style interactive image was created following the VRE framework. For the imaging aspect of the application, SVG was selected due to its open source nature, flexibility, and rendering features. Ajax was identified as a potential technology to handle the attribute data of spatial entities within SVG. Using these two technologies, a web-based interactive image was developed for the Sikyon Project.

Displaying graphics has been a key component of the Internet for much of its existence. From the first (supposed) image on the web, a jpeg of the European Organization for Nuclear Research's (CERN) parody band, 'Les Horribles Cernettes' (de Gennaro nd), to current vector and raster images which are complex and highly detailed, Internet images provide both style and content to otherwise textual web pages. SVG comes into the world of Internet images as a vector-based and open source graphics standard from the W3C. It is XML-based, meaning all the points, lines, polygons, colours, stroke widths, and annotations are held in readable tags. The code for an SVG image looks like that in Code Listing 1 while the representative image can be seen in Figure 9. Using SVG, developers have the ability to create dynamic and interactive images for presentation on the web. SVG is a platform-independent method to display two-dimensional graphics. As Cagle puts it, "SVG will succeed because it satisfies the need for an easy-to-use, inexpensive, dynamic, non-proprietary way to build graphical interfaces" (2002, 12).

Figure 9: The corresponding image of Code Listing 1 displayed in Adobe SVG Viewer (after Watt et al. 2003, 35).

There are many advantages to using SVG over other forms of images in web pages, the first being file sizes. The W3C specifically intended SVG to be a replacement for the many uses of raster graphics on the web with the aspiration that SVG files would be smaller than their raster counterparts (Watt et al. 2003, 12). The actual size of the file depends on how complex the representative image is, but in general a vector image will be smaller than a corresponding raster image. Also to get the same kind of functionality and content an SVG image can contain would require multiple raster images and therefore many more megabytes.

It should be noted that raster and vector images serve two very different purposes (Waller 2007), so comparing them here is only relevant when you consider native vector images rendered as rasters. Since rasters are an array of pixels, the 'white space' is encoded along with the actual elements of the image, making the overall image larger since vector graphics only store information on the elements themselves. In addition to smaller file sizes, SVG images can use controls such as zooming and panning. Using the Adobe SVG Viewer, users can easily adjust the view of the SVG image with these types of controls. SVG also supports the internationalisation of content based on the browser settings of the user. This can be done by including a few more lines of code in the SVG file which, depending on the browser's language, will display the appropriate text. SVG images are also resolution-independent since they are rendered in a manner appropriate to the display device (Watt et al. 2003, 24). This means that SVG images are capable of being displayed on mobile devices. Additionally, text within SVG images is searchable by XML-aware search engines, which contrasts with traditional raster images or Flash counterparts.

The previous advantages were all of a somewhat superficial character since they were related to the display and usage of SVG images. The real power of SVG lies in its XML foundation and open source nature. XML is what is known as a metamarkup language, which is a language that can create other markup languages. Because of this, XML tags correspond to the content within the tag as opposed to a predefined set such as in HTML (Harold and Means 2002, 4). In this sense, XML is able to order and define data in a way that is flexible and extensible (hence the name). The advantages of XML in the heritage sector are well documented (Ross et al. 2004; Falkingham 2005).

Due to its XML foundation, SVG is data-driven. This means that the SVG document can be created dynamically from data held elsewhere, such as from another XML file or relational database management system (Watt et al. 2003, 23). The other significant advantage of SVG is that it is open source. The ability to view the source code which comprises the image is a great asset to the images and the developers. The image's source code can be investigated and modified without the need for special software and does not have the risk of obsolescence associated with other proprietary formats. Through the investigation of the source code, others can understand how the image was constructed. This accessibility of SVG source code will also help spread SVG skills in a manner similar to the spread of HTML several years ago (Watt et al. 2003, 19).

While SVG has many advantages, limitations do exist. One of these is the requirement for a plug-in to view SVG files in some browsers. Microsoft's IE requires a plug-in to view SVG files. The most popular and practicable plug-in for IE is the Adobe SVG viewer, which will unfortunately no longer be supported after 1 January 2009. This date was inexplicably changed from 1 January 2008 sometime in the autumn of 2007. While this is discouraging, Adobe has said that they will continue to make the viewer available to their customers as long as there is a need for it; they will just no longer be updating or patching it. They argue this is the result of the increased pervasiveness of the format and support in major browsers, which is an optimistic assessment at best (Anon. nd b). SVG has been natively implemented in versions of Mozilla Firefox after 1.5, although it is not yet quite the full SVG 1.1 specification and should be considered a technology preview (Anon. 2006a). A hack is available to get full functionality (panning and zooming) out of SVG images in Firefox, which actually involves copying one of the dynamic-link libraries (DLLs) from the Adobe SVG Viewer for IE into a Firefox directory. This kind of functionality can be provided with JavaScript controls as well, but requires a substantial amount of coding to implement. The goal of Firefox is for total specification conformance; however, this is still a long way off (Anon. 2006a). Since the SVG recommendation was only finished at the end of 2001 and there is a naturally slow implementation process, this is not a surprise. However, there have been great strides made since then and it should be expected to continue as widespread acceptance continues. An example of this can be seen in the recently released ArcGIS 9.2 which includes SVG support. SVG images also tend to be CPU intensive depending on the complexity of the image. This will become less of a factor as CPU clock speeds and processor technology continue to advance. Overall the advantages of SVG far outweigh the shortcomings.

 PREVIOUS   NEXT   CONTENTS   HOME 

© Internet Archaeology/Author(s) URL: http://intarch.ac.uk/journal/issue23/5/4.1.html
Last updated: Tue Mar 25 2008