Graphical concrete syntax rendering with SVG

Abstract

Model-based techniques place modeling at the cornerstone of software development. Because of the large number of domains and levels of abstraction one can find in software systems, a large number of modeling languages is necessary. Modeling languages need to be properly defined regarding concrete syntax in addition to abstract syntax and semantics. Most modeling languages use a graphical concrete syntax, and solutions to model those syntaxes appeared. If those solutions are convincing to support the rapid development of graphical modeling tools, they are often restrictive in the range of possible concrete syntaxes for a given abstract syntax, and rely on dedicated technologies. In previous works, we proposed such a solution based on a representation model which was more flexible in that it abstracted away purely graphical concerns. Those concerns include actual design for representation icons, how the design reacts to representation variations within the icons, possible interactions with an icon, and synchronization between the graphical representation and the graphical model. In this paper, we show how to solve those four last points using the SVG open standard for vector graphics. We propose to define representation icons by SVG templates complemented by layout constraints, a predefined and extensible library of possible user interactions using DOM, and a specific approach based on events to synchronize the graphical representation with the graphical model. Thus, our solution solves the concrete realization of an modeling environment cumulating advantages of a clear separation between abstract and concrete syntaxes at the modeling level, while benefiting from the expertise of the vector graphics community. © 2008 Springer-Verlag Berlin Heidelberg.