Journal of Visual Languages and Computing (2002) 13, 35 } 60 doi: 10.1006/jvlc.2001.0226, available online at http://www.idealibrary.com on Flexible Graph Layout for the Web TREVOR HANSEN*, KIM MARRIOTT*BERND MEYER* AND PETER J. STUCKEY- *School of Computer Science and Software Engineering, Monash University, Clayton, Victoria 3168, Australia, E-mail: marriott, berndm@csse.monash.edu.au and -Department of Computer Science and Software Engineering, University of Melbourne, Parkville, Victoria 3052, Australia, E-mail: pjs@cs.mu.oz.au Received 12 April 2001; revised 14 September 2001; accepted 14 September 2001 More powerful personal computers and higher network bandwidth has meant that graphics has become increasingly important on the web. Graph-based diagrams are one of the most important types of structured graphical information. Here we demonstrate how XML can be used as the basis for contents-based delivery of graph-based diagrams. The main distinguishing feature of our approach is that it separates style and content of diagrams in the same way as (XML-based) markup languages for textual information do: The diagram itself is marked-up according to its logical structure and its visual appearance is defined via attached style sheets. Such an approach poses interesting challenges for the browser component, because it requires automatic layout of complex diagrammatic information that takes stylistic constraints into account. We present a prototype system for our approach comprised of three main components: a contents-based markup language, GXML, for specifying graph-based diagrams, a style sheet language, GXSL, for such diagrams and a browser that can display styled graphs from this information. 2002 Elsevier Science Ltd. All rights reserved. Keywords: graph layout; constraints; style sheets; World Wide Web. 1. Introduction WITH THE ADVENT of increasingly more powerful personal computers and higher bandwidth connections, the web has become a medium that relies more and more on graphical communication. Traditionally, most of the graphical information exchanged on the web is in the form of low-level pixel-based encodings such as GIF or JPEG formats, but it is clear that for many applications this is inadequate. Not only does such an encoding waste bandwidth, it does not support searching and does not allow manipulation of the graphical contents on the client side. Worse, it makes it virtually impossible for a client to adapt graphics to different viewing conditions, such as very small displays on PDAs or mobile phones. The arguments for a separation of structure from style, such as adaptability to viewing conditions, searchability, ability to easily generate output from databases, etc., are well known. In fact, this separation of concern is one of the fundamental issues in the design of languages for web documents and is manifest in almost all web standards from the HTML /CSS [1] combination to XML /XSL [2, 3]. 1045-926X/02/$ - see front matter 2002 Elsevier Science Ltd. All rights reserved.