A library for reactive data visualizations.
This project is about encapsulating dynamic behaviors that are common to many data visualization types. It is intended to be the foundation for authoring reusable interactive data visualization components that can easily be extended and composed.
The reactive-vis stack for interactive data visualizations.
reactive-model |
D3
Each function is a "reactive mixin", meaning that it can be invoked using model.call. For all functions, the first argument model is an instance of reactive-model. Each function adds new properties and reactive functions to the specified model.
Note that names for nodes in the data flow graph diagrams follow the convention that camelCase
names are properties with values, and dash-separated
names reactive functions that have side effects but no returned value (typically these are DOM manipulations). Hyphenated names serve only to document what the reactive function does, they are never actually assigned values.
# ReactiveVis.SVG(model)
Properties added:
Reactive functions:
width
attribute of the SVG element based on the value of model.width.height
attribute of the SVG element based on the value of model.height.# ReactiveVis.Margin(model)
Encapsulates margins. Inspired by D3 Margin Convention. Depends on SVG.
Properties added:
<g>
element, appended as a child to model.svg.Reactive functions:
transform
attribute of model.g based on model.marginTop and model.marginLeft.# ReactiveVis.Data(model)
Properties added:
This project is similar to:
The build tooling for this project draws from:
Previous initiatives that feed into this work: