Editing SVG with other XML languages

Amaya is a Web client that acts both as a browser and as an authoring tool. It has been designed by W3C with the primary purpose of demonstrating new Web technologies in a WYSIWYG environment. Documents mixing XHTML text, MathML equations, and SVG graphics can be browsed and edited with Amaya. All these XML elements can be styled in a uniform way with CSS (Cascading Style Sheets) stylesheets. When edited, those compound documents can be either saved in the local file system or published on remote servers through the HTTP PUT method. Amaya is also able to browse and edit any XML document and to format it through CSS stylesheets.

Unlike Amaya, several browsers display SVG drawings within plug-in boxes. In this case, SVG is processed like other rendered pictures and must be transmitted and updated as separated documents. The plug-in approach also makes interactions of SVG with the rest of the document more complex or sometimes impossible. This is important as different XML languages can be combined in a same document. For example, due to current plug-in API limitations, CSS stylesheets rules defined for the top document may be not transmitted to embedded SVG.

The integration of SVG and other languages in the same browser/editor is certainly a good solution for both users and authors. XML namespaces already allow to combine different XML languages in a same document. For example, we can have an XHTML document with SVG maps that include XHTML tables, with MathML math expression within tables, and other nice graphics. At the same time, authors can use an uniform user interface for editing all these XML languages. Implementation is also easier as code can be shared for multiples languages. For example, only one instance of the XML parser and the CSS engine are necessary. Some drawing routines can be shared too.

User interface must give users a way to handle multiple XML namespaces at once. In order to achieve this integration, Amaya dynamically adapts its interface according to the languages used in documents, providing a WYSIWYG editing mode, without the need of knowing underlying technologies. As a WYSIWYG approach is not always adapted to edition, Amaya provides multiple points of view for a given document, such as the source view, the structure view, and the list of links. The most interesting feature is that the main view can be used for both edition and browsing. Moreover, views are synchronized even during user interactions and when you select characters or elements in one view of a document, Amaya automatically scrolls the other views of the document to show the selected items.

While the basic features presented above are already implemented, more is needed to obtain a fully featured editing tool for SVG. We are currently implementing the SVG tiny module, including its animation features. We are also planning to add SVG component libraries that will provide the user basic components (arrows, blocks, trees, ...) that can be used to create more complex graphic by means of the DEF and USE SVG elements. A benefit of using DEF and USE is that users will be able to edit the components themselves without changing the more complex graphics where they are used.


INRIA Rhône-Alpes

Zirst - 655 avenue de l'Europe

38334 Montbonnot -Saint Ismier Cedex FRANCE

Phone : +33 (0)4 76 61 53 58

Fax : +33 (0)4 76 61 52 52