In the last few decades, there has formed a layer of traditions in the information processing from di erent elds of science and technology, which includes a variety of standards, techniques and approaches for visual analysis of diverse types and structures of data. Every year, the advanced technologies of human-computer interaction and computer graphics are becoming closer to information-based areas of activity, providing exible and adaptive solutions in the implementation of user interfaces for information management and decision-making systems that involving the human-analyst. Taking into account the fact that the resulting quality of activity in various areas of high-tech depends on the ability of studying and mastering of complexly structured storages of multidimensional data, the issue of developing e ective user interactions for visual analytics tools is becoming increasingly important. This paper pays attention to the problems and possible solutions of e ective visual representation and management of static and dynamic graph-based datasets. Particular attention given to ergonomic approaches of data visualization and concepts of its gesture-based handling and control.
Among the wide variety of books and publications, focused on the intersection of CHI and Data Visualization, there is a bias in applied areas, while more fundamental things as the design and ergonomics of the both of interaction patterns and visual symbolic systems are leaving without due attention. Even the developers of specialised software for data analytics, who should be well acquainted with the capabilities of advanced input devices (e.g. touch screens or surface stylus pens), still remain using interactions that are more typical for the WIMP (windows-icons-mouse-pointer) concept with its limitations. So far, the most of visual analytics tools are inside the button paradigm: that is the user actions are typically launched by the pressing a real or virtual but still button, sometimes even with a stylus or a touch surface.
For a human, well familiar with the culture of writing, the poking of points as the base way of user interactions does not seem to be natural. Having advanced input devices and computing systems, which are enough to enable the adaptive and reactive gesture recognition, now is the good time for the reasonable amplication of low-level interactions in order to reduce the number of micro-gestures (e.g. click sequences) at least for visual data analytics software, based on pencentric input systems. As a good practical example of e ective application of sketch-based interactions, it is worth considering the user interfaces for graph exploration and editing. Due to the large number of demanded functions for application to the graph elements, layouts and views, the implementation of user strokes tracing and recognition in the context of an active interaction mode may be an e ective solution. The e ectiveness of the mentioned above application example may also depend on the readability of the graph. The topic of visual graph or hyper-graph representation is quite complex and requires special study. However, among the approaches to partially ordered graph visualization, it is worth noting the circular layout that has strengths in the both of the convenient form for visual human perception and the exibility in arrangement methods.
This paper is organized as follows. The \Related Work" section gives a brief review of graph-based data visualization and manipulation techniques. The \Towards Reactive Interacting" section overviews the approaches to the building of gestures design space and the realisation of reactive interactions. The \Towards Flexible Visualizing" section is reviewing the visualization techniques by means of node-link-group diagrams. 2
One of the most demanded concepts for visual analytics tools that has a rich
theoretical foundation, which allowing to study multidimensional datasets with
complex structures, is the interactive graph exploration. The signi cance and
ubiquity of interactive graph exploration are beyond any doubt: it gives wide
opportunities for extensive analysing of relationships and dependencies along
with patterns and exceptions in complex data such as biological, transport or
nancial datasets, etc. Among the variety of combinations and hybrids of
visualization methods, node-link diagrams on the force-layout basis remain demanded
for exible representation of network data like collaborative, social or
communication networks. However, the readability and manageability of this type of
diagrams are an open problem: typical solutions (such as geometric
compression, semantic abstraction, topologic simpli cation, etc.) provide to the analyst
albeit complete, but xed and arduous result [
E orts on post-layout enhancement of graph visualization are usually
associated with clusterization and multi-view representation [
Focusing on the visual part, it is worth noticing a large number of
visualization techniques in the literature that represent graphs using node-link diagrams
[
Techniques and tools for visual analytics are often represented by a complex and diverse set of using actions. Typically, each action performed by an elongate combination of separate short-term manipulations with branching menus, multiple sliders and numerous buttons. Although, in some cases, it is more convenient to expand the set of manipulations through use of natural for humans stroking and touching sequences. Within context-aware applications, the access to available actions by sketching and drawing gestures could be obvious and convenient. Interactive data visualization that supplemented with tracing and recognition of pen-centric sketching, drawing and tapping, which are technically available from any pointing device, opens new opportunities for layout control during exploratory data analysis. The current section presents an approach to gestures processing, comprising a controller that classi es advanced pointer events and a manager that allows handling events on data visualization elements. 3.1
Advanced Pen-centric Control of Data Visualization
In order to expand the range of a user commands set, recognizable by the
system, an extended approach to interpreting the input strokes is proposed. To
broaden the classi cation of pen-centric gestures perceived by a system, the
set of measurements as in Fig. 1A is proposed for usage. Creating and dynamic
updating of the gesture space is available with the potential of reactive
programming [
Depending on tasks and goals, performed during data exploration, pencentric interactions require di erent levels of input precision. If general draft actions like a preselection (that can be corrected further) or a gesture-command (having a good potential to be recognized) are feasible even with a rough stroke, the manipulations with elements of visualization require greater accuracy. The described user interface solves relatively complex view-driven tasks through easyperforming pointing device gestures of two main types. The rst type is the imprecise drawing for shape recognition (which applies a corresponding action, in particular the nodes alignment as in Fig. 4) or contextual tracing (for a rough outline of constraints, as on the group selection tool in Fig. 5A). The second type is the precise drag-and-drop manipulation that is a direct moving of graph nodes or an accurate adjustment of the ruler sliders (as in Fig. 5C). The set of pen-based single-stroke gestures for recognition is due to ease of drawing, regardless whether it painted by a hardware stylus, or by a nger on touch-screen device, or by a mouse. Sketching above the graph may be optionally visible: if desired, the user interface allows to enable the indication of gesture path with fading trace of a pointer, as well as to show a recognized pattern upon completion. In addition to the untangling of force-directed layout while stroking above it, the toolset provides usual actions as searching, brushing, picking and direct modi cation of individual or related nodes and groups. 4
This section proposes guidelines to provide indications for an e ective visual relational analysis and chronology browsing of graph-based (as well as hypergraph-based) datasets. Such guidelines have been de ned on the basis of relevant papers and on the study about divergent possible visual representations of hypergraphs. As depicted in Fig. 6A, the semantics of data structure considers: { Nodes, for instance, members of a collaboration network; { Links, that are connections between vertices; { A liations, grouping relationships of vertices; { Relations, the dependencies among existing Groups.
Groups interrelated among themselves, representing a range, a tree, or a
sparse network, contain relatively densely linked nodes. Each node may be a
liated with a group or a set of groups. The hyper-edge speci es a set of nodes or
an ordered list of nodes. In the following, techniques for representation of nodes,
links and groups, along with their composition (see Fig. 6B), are reviewed in
order to explore and nd proper visualization methods, related to circular,
radial or spiral layout for the node-link diagram with groups. This study excludes
graphic e ects, animation and obvious ways of coding, as colouring and
conditional marking [
When the grid consists of concentric circles and centripetal lines and the
visualization is crowded, following curved lines can be di cult for a user. In
order to ease the reading of adjacent lines or sectors, there are several possible
implementations of segmentation of the diagram areas: the sectors, the circles,
the zebra stripes segments (Fig. 7D). Visualizations may support extending of
a selected sector angle and height stretching of a selected circle (Fig. 7C), or
adding of related details (Fig. 7E).
The main components of the diagram are nodes, links and groups, which are
described below. According to Krzywinski [
The purpose of a link between a node pair is the binding of two elements of
the same type with a single line. This paragraph intentionally does not mention
the styling techniques that use colour, thickness, and other accessible attributes
of a line, which are widely observed in surveys and literature [
Fig. 8. Basic types of layers for circular layout (A): silhouette, pattern, glyph. Combining variations of layers (B): direct review for the related item (blue), overview for a group of neighbours (violet), report for a pair of distant nodes (dark grey).
Considering that the polar coordinates grid has two basic elements (the circle and the intersection of straight lines) among the variations of the line shape it is worth highlighting the following. Orthogon, which, in principle, may represent an alternate polygon tted for the polar grid properties. Applicable for symmetrically spaced distant nodes. Round, which follows the shape of a circular diagram and looks neat at close radial distances. Conoid, in contrast to the previous types, it is fully overlaid on the grid. It combines the ability to vary in two dimensions at once, through a rotation angle and a height above/below the node placement guide. In addition to joining a pair of nodes, it may denote the quantitative or chronological properties of a link by the sequence of bends.
Many graphical solutions were proposed and applied to indicate containment
contexts of node sets: i.e. belonging of data units to certain classes for both
hyper-links in graphs [
Visual grouping of nodes can be done using the alignment by a grid (in order to achieve uniformity or proximity of adjacent units) and express containment through graphic connectors. In the case of alignment (Fig. 10A), the visual e ect of grouping is achievable through gaps and spaces on the circular visualization, as well as using layers. To express containment, neighbour nodes can be combined in groups of geometric outlines or underlines (Fig. 10B, left), distant nodes can be gathered in groups with compound geometric or free-form contours and paths (Fig. 10B, right), or via visual compression (as in Fig. 10D).
Depending on the task and the level of visual di erentiation for node-linkgroup diagram items, the circular layout may contain combinations of completely di erent approaches to design or synthesis. Having a rich and wide overview of the variety of representing modes for each element, it is important to know how to combine them e ectively and properly for practical applications. 5
De nitely, the visual analytics technologies have great potential for increasing the e ectiveness of interactions during data exploration, as well as for improving the readability and aesthetic qualities of data visualization.
Among the advantages of drawing gestures is the distribution of application functions between di erent physical user actions. Implementation of the presented interaction style for enough complex data visualization tools, intended for use by quali ed users, can speed up the analytical work by replacing multistep actions (like selections in cascade menus) with pen-centric shortcuts. During ltering and querying, when it is required just to \outline the boundaries" of interesting values, this interaction style allows to signi cantly reduce a number of short-term user manipulations with control elements by accomplishing the task in one gesture.
The future work towards reactive interacting will expand the capacity of sketch-based gestures, applicable in visual analysis of various by type and structure datasets, through the usage of multiple-touch and multiple-stroke actions, and their combinations. Particular attention will be paid to studying of the users learnability and preferences in a choice of gesturing methods and techniques for speci c view-driven applications.
Developing of the guidelines and framework for graph-based data visualizing using circular techniques, which mainly focuses on the di erent possibilities of visual representation of graphs and hyper-graphs, has a purpose to help practitioners to have an easy reference in choosing the right technique according to speci c needs. This work will continue by assembling existing techniques in the literature and developing the software framework that provides a systematic proposal of a set of techniques, which can be useful for designing of static or dynamic graphs and hyper-graphs.