Visualizing Information Using SVG and X3D

309 Pages·2005·3.839 MB·English

by  Vladimir Geroimenko DSc, PhD, MSc (auth.), Vladimir Geroimenko DSc, PhD, MSc, Chaomei Chen PhD,MSc, BSc (eds.)

Visualizing Information Using SVG and X3D
Vladimir Geroimenko and Chaomei Chen (Eds)
Visualizing Information
Using SVG and X3D
XML-based Technologies for the XML-based Web
With 125 Figures
including 86 Colour Plates
123
Vladimir Geroimenko,DSc,PhD,MSc
School ofComputing,University ofPlymouth,Plymouth PL4 8AA,UK
Chaomei Chen,PhD,MSc,BSc
College ofInformation Science and Technology,Drexel University,
3141 Chestnut Street,Philadelphia,PA 19104-2875,USA
British Library Cataloguing in Publication Data
Visualizing information using SVG and X3D:XML-based
technologies for the XML-based web
1.Information visualization 2.computer graphics 3.SVG
(Document markup language) 4.XML (Document markup language)
5.Semantic Web
I.Geroimenko,Vladimir,1955– II.Chen,Chaomei,1960–
005.2′76
ISBN 1852337907
CIP data available
Apart from any fair dealing for the purposes ofresearch or private study,or criticism or review,as per-
mitted under the Copyright,Designs and Patents Act 1988,this publication may only be reproduced,
stored or transmitted,in any form or by any means,with the prior permission in writing ofthe pub-
lishers,or in the case ofreprographic reproduction in accordance with the terms oflicences issued by
the Copyright Licensing Agency.Enquiries concerning reproduction outside those terms should be sent
to the publishers.
ISBN 1-85233-790-7 Springer London Berlin Heidelberg
Springer is a part ofSpringer Science (cid:1) Business Media
springeronline.com
© Springer-Verlag London Limited 2005
Printed in the United States ofAmerica
The use ofregistered names,trademarks,etc.in this publication does not imply,even in the absence of
a specific statement,that such names are exempt from the relevant laws and regulations and therefore
free for general use.
The publisher makes no representation,express or implied,with regard to the accuracy ofthe informa-
tion contained in this book and cannot accept any legal responsibility or liability for any errors or omis-
sions that may be made.
Typeset by Gray Publishing,Tunbridge Wells,UK
34/3830-543210 Printed on acid-free paper SPIN 10942703
Contents
Foreword by Tony Parisi . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . vii
Preface . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ix
Contributors . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . xiii
Part 1: Using SVG and X3D in Generic Web Applications . . . . . . . . . . 1
1 SVG and X3D in the Context ofthe XML Family and the
Semantic Web. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3
Vladimir Geroimenko
2 The Foundations ofSVG. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21
Kurt Cagle
3 X3D Fundamentals. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 63
Don Brutzman,James Harney and Curt Blais
4 SVG as the Visual Interface to Web Services . . . . . . . . . . . . . . . . . . . 85
Shane Aulenback
5 X3D Graphics,Java and the Semantic Web. . . . . . . . . . . . . . . . . . . . . 99
James Harney,Alan Hudson,Curt Blais and Don Brutzman
6 Distributed User Interfaces:Toward SVG 1.2. . . . . . . . . . . . . . . . . . 119
Kurt Cagle
7 Publishing Paradigms for X3D . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 153
Nicholas F.Polys
Part 2: Applying SVG and X3D to Specific Problems. . . . . . . . . . . . 181
8 Visualizing Complex Networks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 183
Chaomei Chen and Natasha Lobo
9 Applying SVG to Visualization ofChemical Structures and
Reactions. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 202
John Leaver
v
vi Contents
10 Using Metadata-based SVG and X3D Graphics in
Interactive TV. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 225
Artur Lugmayr and Seppo Kalli
11 Knowledge Visualization Using Dynamic SVG Charts . . . . . . . . . 245
Nikolas A.Rathert
12 Using SVG and XSLT to Display Visually Geo-referenced XML . . 256
Timothy Adams
13 Using Adobe Illustrator to Create Complex SVG Illustrations. . . 266
Sara Porter
14 X3D-Edit Authoring Tool for Extensible 3D (X3D) Graphics . . . . 285
Don Brutzman
15 Concluding Remarks. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 293
Vladimir Geroimenko and Chaomei Chen
Index. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 295
Foreword
Correcting the Great Mistake
People often mistake one thing for another.That’s human nature.However,one
would expect the leaders in a particular field of endeavour to have superior abil-
ities to discriminate among the developments within that field.That is why it is so
perplexing that the technology elite – supposedly savvy folk such as software
developers,marketers and businessmen – have continually mistaken Web-based
graphics for something it is not.
The first great graphics technology for the Web,VRML,has been mistaken for
something else since its inception.Viewed variously as a game system,a format for
architectural walkthroughs,a platform for multi-user chat and an augmentation of
reality,VRML may qualify as the least understood invention in the history ofinfor-
mation technology.Perhaps it is so because when VRML was originally introduced
it was touted as a tool for putting the shopping malls ofthe world online,at once
prosaic and horrifyingly mundane to those ofus who were developing it.Perhaps
those first two initials,“VR”,created expectations ofsprawling,photorealistic fan-
tasy landscapes for exploration and play across the Web.Or perhaps the magnitude
of the invention was simply too great to be understood at the time by the many,
ironically even by those spending the money to underwrite its development.
Regardless of the reasons,VRML suffered in the mainstream as it was twisted to
meet unintended ends and stretched far beyond its limitations.
VRML was originally intended to be a platform for delivering,presenting and
executing interactive 3D graphics – period, full stop. This meant any graphical
application,ranging from the prosaic to the fictional,from fully photorealistic to
purely synthetic.What attracted me to work on VRML in 1994 was its potential to
transform the human–computer interface from a 2D window- and page-based
metaphor into a 3D metaphor ofobjects and spaces.Such objects and spaces might
be photorealistic and verisimilar;they might just as easily be abstract and fantas-
tic.The point is:they are intended to convey information.
The great mistake ofWeb media is that the developers and marketing machines
ofhigh-tech companies believe and actively promote the idea that the primary use
for graphics is as “art rather than information”: the stuff of banner ads,games,
walkthroughs and avatars.This misguided notion ignores the reality that comput-
ers are still largely used for managing,sharing and communicating textual and
numeric data.Take a look at today’s 2D computer applications.How many ofthem
are oriented toward managing abstract entities – numbers,words or folders full of
files – versus real-world images and sounds? You will discover that an overwhelm-
ing majority of these applications are intended for the former. Granted, images,
sounds and video account for a growing amount of the data stored on personal
vii
viii Foreword
computers and shared over the Web.However,even that data is presented via an
organizing principle known as the user interface:an abstract thing,generated from
underlying relationships in the data – not painted by artists.
The Web is a fine place for sharing family photo albums,displaying ads and
playing games.However,I predict that these applications ofWeb graphics will be
dwarfed in comparison by its absorption into the mainstream in the form ofsim-
pler and more intuitive interfaces,rich media presentations,interactive training
manuals and animated multidimensional charts.Ultimately,the percentage of2D
and 3D Web graphics created by artists compared with that generated using data
visualization techniques will probably be close to the percentage ofPC users who
own a licensed copy ofPhotoshop,and the mix ofapplications roughly what we see
on today’s desktop computers.As in the real world,art will constitute a minority of
the use ofthe Web.
This book is for those of us who wish to take advantage of the rich palette of
objects provided by SVG and X3D – two new standards for delivering interactive
2D and 3D graphics and animations over the Web – but have neither the requisite
skills nor the luxury of time to create original artwork and hand-crafted objects.
We have data;we want to see and understand it.Visualizing Information Using SVG
and X3Dpresents a range oftechniques and tools for realizing that desire in code
and in context. System programmers can use the information in this book to
develop complex client–server frameworks for presenting and navigating data
using rich media interfaces; application writers can integrate the results of that
work to convey meaning for particular kinds ofdatasets;developers ofauthoring
environments can provide drag-and-drop tools for creating easy to navigate user
interfaces at the touch of a button.Together,these building blocks enable us to
understand and interpret our information better and instantly share the results
with everyone on the Internet.
SVG and X3D are based on XML,the common glue that binds together the next
generation ofWeb data.XML promises to be the foundation ofa “Semantic Web”:
a web where information is given meaning.Although art will play an important role
in the unfolding ofthis new Web,that role will not be fundamental.The Semantic
Web will be built upon data,reified in graphics and sounds generated by programs.
The software developers and information designers working in data visualization
today are the architects of a new and brilliant medium for understanding our
world.This book provides an entry point for joining that revolution.It also repre-
sents a vital course correction for Web graphics:maybe now we can stop chasing
the butterflies and get back to changing the world.
Tony Parisi
San Francisco,California
18 May 2004
Preface
Vladimir Geroimenko and Chaomei Chen
Information visualization is one ofthe most important and well-established areas
of research and development. In recent decades, it experienced remarkable
achievements,especially in enhancing the visual appearance ofthe Web in order to
make it more attractive and useful for the user.As has happened with many other
areas,the Web has become one ofthe few ubiquitous driving forces behind the cur-
rent development ofinformation visualization.
The Web is undergoing revolutionary changes – its second generation is emerg-
ing.The key player in the new generation is not HTML but XML (this is why it is
also known as “the XML-based Web”).If the appearance ofWeb pages is a major
concern in the first generation,then the meaning (or semantics) ofinformation on
the Web is the focus of the second generation,which is why it is also called the
“Semantic Web”.The fundamental idea ofthe Semantic Web is to enable computers
to deal with the Web information in a much more meaningful and practical way as
ifthey are able to understand it to some extent.This phenomenon will be achieved
by marking up the meaning ofthe data with domain-specific XML tags,by describ-
ing further relationships between the hierarchical system ofmeanings using spe-
cialized technologies such as RDF (Resource Description Framework) or OWL
(Web Ontology Language) and by adding many other technological and concep-
tual layers required to enable computer programs to handle Web data properly
without human intervention.
Rome was not built in a day.According to Tim Berners-Lee,the inventor ofthe
current Web and the Semantic Web,it may take up to 10 years to complete the
building ofthe second generation ofthe Web by continuing to add new layers.To
achieve the revolutionary transition,there is a lot of work to do and a lot of dis-
crepancies and conflicts to resolve.Given the indispensable role ofWeb graphics in
today’s Web,it is a natural starting point for a journey that may join some of the
most visionary routes and promising techniques.
On the Semantic Web,almost everything will be written in XML-based plain
text format and will include metadata (data about data) that make the data under-
standable by computers.Web graphics are not an exception.Both two- and three-
dimensional graphics will be presented in XML-based formats, called SVG
(Scalable Vector Graphics) and X3D (Extensible 3D Graphics),respectively.
This book is the first research monograph that explores the opportunities of
designing and using Web graphics in the broader context ofXML.It focuses on the
use of SVG and X3D in generic Web applications and the applications of these
novel technologies to specific problems. All these areas are considered in the
broader context ofthe XML family oftechnology and the emerging Semantic Web.
SVG and X3D are leading-edge technologies primarily because they are native to
ix
x Preface
the XML-based Web.This means that they can be easily and seamlessly integrated
with practically any other XML technologies,including those dealing with semantics,
ontologies and metadata.Moreover,XML desperately needs these native technolo-
gies for representing Web data in a visually rich form since one ofthe fundamen-
tal principles behind XML is the separation of data from presentation rules.
Basically,XML documents contain nothing else but pure data,and therefore the
use ofadditional technologies is required to go beyond graphically primitive rep-
resentations ofXML data.
Taking these radical changes into consideration,it becomes obvious that infor-
mation visualization is going to experience new and exciting life on the Second-
generation Web. It will deal with two- and three-dimensional graphics that are
written in plain text format,understandable by computers,integrated with dozens
and dozens ofother XML technologies,vitally important for the visually rich rep-
resentation of“nothing-but-pure-data”XML documents,and so on.This is the first
book that directly addresses these significant and fascinating areas of this new
terra incognita.It is also a conceptual sequel to our pioneering book Visualizing
the Semantic Web:XML-based Internet and Information Visualization,published by
Springer in 2003 (ISBN-1-85233-576-9).We hope that this new monograph will
stimulate and foster more studies and more books on the SVG/X3D-based visuali-
zation ofthe new version ofthe Web.
The book is arranged as follows.
Chapter 1,“SVG and X3D in the Context of the XML Family and the Semantic
Web”,explores the place ofSVG and X3D technology within the architecture ofthe
second-generation Web.
Chapter 2,“The Foundations ofSVG”,is a concise but comprehensive introduc-
tion to the scalable vector graphics language.It covers both the SVG 1.0 and 1.1
specifications and aspects ofthe SVG 1.2 specification that are unlikely to change
significantly after the publication ofthis book.
Chapter 3,“X3D Fundamentals”,provides the reader with high-level exposure to
many of the fundamentals of the international standard for 3D graphics on the
Web. From basic scene construction to incorporation of simple behaviours, it
attempts to walk the reader through enough ofthe syntactical requirements while
keeping a high-level overview perspective on the underlying infrastructure sup-
port that makes X3D possible.
Chapter 4,“SVG as the Visual Interface to Web Services”,describes the relationship
between XML data,Web services and SVG as a visual interface.It provides the defin-
ition ofa Web service and identifies its core components and the workflow ofa typ-
ical Web-based visualization or application.Also,it points out the technological gaps
in providing a solution today and showcases the tools being provided from such ven-
dors as Corel Corporation that will close the gap and make this a viable solution.
Chapter 5,“X3D Graphics,Java and the Semantic Web”,shows the reader how to
use the Java programming language to manipulate X3D graphics scenes.First,it
reviews the X3D Object model and the concept of fields and nodes that compose
the building blocks used to create an X3D scene.Then,it examines how we can uti-
lize more advanced manipulation of an X3D with Java and ECMAScript to make
more interesting content. Finally, it looks at how X3D can be leveraged in the
framework of an XML-based Web for dynamic representation and interaction of
information in a Web services context.
Chapter 6,“Distributed User Interfaces:Toward SVG 1.2”,focuses on the SVG 1.2
working draft that offers a number ofvery compelling pieces that will have a direct
Preface xi
impact on the way that we build large-scale,distributed applications.It looks more
specifically at some ofthe changes implicit within the SVG 1.2 working draft that it
is hoped will provide a meaningful answer to how such applications can and will
be written.
Chapter 7,“Publishing Paradigms for X3D”,reviews the literature on interactive
3D visualizations and enumerates criteria to design successful and comprehen-
sible visualizations.It focuses on modular approaches to X3D scene design and
production and examines how XSLT can be used to transform and deliver XML
data to X3D visualizations within current publishing paradigms.
Chapter 8,“Visualizing Complex Networks”,explores networks as one of the
most powerful means of abstracting and analysing an extremely wide range of
complex phenomena.It introduces the latest advances in complex network theory,
followed by a survey ofthe most representative network visualization techniques.
In particular,the chapter focuses on the need for modelling and visualizing the
growth of complex networks.It examines a number of well-known examples of
network growth models and their underlying theoretical expectations.The role of
available standards and techniques,such as VRML,SVG and X3D,is presented in
this context.Challenging issues are identified with respect to the future ofX3D and
other 3D graphics initiatives.
Chapter 9,“Applying SVG to Visualization ofChemical Structures and Reactions”,
explores some of the possibilities available to the chemical educationalist for
developing learning materials and experiences that use SVG for the visualization
oforganic compounds and reaction mechanisms.It shows how SVG might be used
as a vehicle for the introduction ofnumerical and computing “key skills”into stu-
dent work and reviews some tools available for creating chemical structure graph-
ics in SVG format.
Chapter 10,“Using Metadata-based SVG and X3D Graphics in Interactive TV”,
starts with the presentation of digiTV’s essentials and its convergence with the
third generation of Web-based multimedia.New audiovisual content models are
presented and software architecture for consumer devices is shown.Television tells
narratives in a virtual story space, with which the consumer can interact. This
leads to new service types and application scenarios of graphics in digiTV,espe-
cially by involving SVG and X3D graphics.
Chapter 11,“Knowledge Visualization Using Dynamic SVG Charts”,describes
the relationship between rating data and generated charts used for SVG-based data
visualization.The main focus in this chapter is to explain how SVG technology
may be used to visualize rating data that is collected in the context ofa knowledge
management application.The case study discussed in this chapter shows how the
visualized data may support consultants in their daily work:the charts are useful
to analyse and identify weak points,strengths and forthcomings within an organi-
zation.Another advantage is the support ofdifferent kinds ofdevices – dynamically
generated SVG charts can be used both on a standard computer and on personal
mobile devices.
Chapter 12,“Using SVG and XSLT to Display Visually Geo-referenced XML”,
focuses on SVG as a means ofdisplaying geographical information that allows us
to display XML data visually on a map.The chapter gives examples of how XSLT
can be used to merge data from different XML files by using a combination ofthe
document() function and the key() function.Since the document() function can be
used for combining several XML files,the examples can be expanded to allow the
use ofan intermediary file such as a gazetteer or a postcode reference file.