Declarative Interaction Design for Data Visualization

Arvind Satyanarayan, Kanit Wongsuphasawat, Jeffrey Heer

Brushing interaction expressed with our extensions to Vega: signal definitions and usage are in blue, event streams in orange, predicate definition and application in purple, rules in red, and names in green.

Abstract

Declarative visualization grammars can accelerate development, facilitate retargeting across platforms, and allow language-level optimizations. However, existing declarative visualization languages are primarily concerned with visual encoding, and rely on imperative event handlers for interactive behaviors. In response, we introduce a model of declarative interaction design for data visualizations. Adopting methods from reactive programming, we model low-level events as composable data streams from which we form higher-level semantic signals. Signals feed predicates and scale inversions, which allow us to generalize interactive selections at the level of item geometry (pixels) into interactive queries over the data domain. Production rules then use these queries to manipulate the visualization’s appearance. To facilitate reuse and sharing, these constructs can be encapsulated as named interactors: standalone, purely declarative specifications of interaction techniques. We assess our model’s feasibility and expressivity by instantiating it with extensions to the Vega visualization grammar. Through a diverse range of examples, we demonstrate coverage over an established taxonomy of visualization interaction techniques.

Citation

Declarative Interaction Design for Data Visualization

Arvind Satyanarayan, Kanit Wongsuphasawat, Jeffrey Heer

ACM User Interface Software & Technology (UIST), 2014.

Bibtex

@inproceedings{2014-reactive-vega-model,
 title = {{Declarative Interaction Design for Data Visualization}},
 author = {Arvind Satyanarayan AND Kanit Wongsuphasawat AND Jeffrey Heer},
 booktitle = {ACM User Interface Software \& Technology (UIST)},
 year = {2014},
 url = {http://vis.csail.mit.edu/pubs/reactive-vega-model}
}

Materials

Videos

Video Preview