Graph interaction design document

1.0 Introduction

While the Diva canvas provides a good abstraction for event-handling and interaction in a structured graphics environment, this abstraction can be improved upon for the particular purpose of graph editing. This document describes the design of a graph interaction package in which a particular application can easily customize the behavior of the editor by receiving high-level "graph interaction events". We start by describing the sort of things we'd like to be able to do while editing graphs to motivate this abstraction and give a description of the architecture which accomplishes this.

2.0 Design

There are a couple obvious configurations that an interactive graph editor should have. A hierarchical graph is about containment (graphs containing nodes, and compound nodes containing other nodes) and connectivity (edges connecting nodes at various levels of nestedness), so these two things are explained separately.

2.1 Node dragging

The way a user interactively modifies containment in a graph is to drag nodes out of one compound node and into another. However, depending on the application, it might not make sense for a user to place certain nodes inside other nodes. In our design, the application is given the opportunity to veto users drags by throwing an exception when it receives a dropped callback. The application's exception handler will replace the node at its previous position before the user began dragging. Furthermore, the application may wish to give the user visual feedback as the user drags nodes, based on some semantic property of the layout (e.g. the color the node being dragged by its "affinity" to the nearst neighbor node). By using general callbacks which correspond to every "interesting" event in the user's dragging of a node:

2.2 Edge dragging

Edge dragging is very similar to node dragging, but is slightly more complicated because more entities are involved. Certain edges should not be able to connect to certain nodes, depending on the semantics of the application or the particular state of the program. Similarly, the user might wish to update the visual appearance of the edge (e.g. its color, dashed-ness, etc.) as it is dragged, to reflect some property of the system. There are actually two cases of edge dragging: as an edge is created for the first time, and as an edge is re-connected between two different nodes. The callbacks which relate to edge connectivity are:

4.0 Examples

[Incomplete]