Visualization Grammar — VEGA


A visualization grammar, a language for:
* — creating, saving and sharing interactive visualization designs
* — describe visual appearance and interactive behaviour of visualization in json
* — reactive signals that dynamically modify a visualization in response to input
event streams

Key Semantics:

The key semantics are:
* — width, height, padding, autosize (all are for specifying the size of the
* — data (an array of data definitions, can define type, name, stream, url, and values of the
data type)

  • — scales (Configurations for as to map columns of data to pixel positions or
    colors, or type of representation(for ex: categorical==> bands etc)).

  • — axes (Configuration of axes)

  • — marks (Graphical primitives, which are used to encode data. Has properties
    position, size, shape, color. Examples are: dot, circle, rectangle(bar-chart),
    star etc..)

  • — Have sub properties encode which marks the graphical primitives
  • — Encode’s Sub property enter and exit configure interactive parts when
    the mark is added or removed.
  • — marks sub property hover, update configure overall interactive parts
  • — each of the hover, update properties can be triggered/linked to signals
    and changed accordingly
  • — A special type of mark called group is present and can contain other
    marks(for composition of graphical primitives to create complex ones)

  • — signals (act as dynamic variables, or as event-listeners to use js parlance)

  • — Has sub property event streams
  • — Can set dynamically evaluated variables as values on events as
  • — Events can be mouse over, mouse out, click,drag etc..
  • — Event streams
  • — Has sub properties source, type, marktype, between, consume, filetr etc.
  • — Each sub property decides which mark to change/update, based on which
    event type/user-action/data-change
  • — Event streams also have CSS-style selectors

  • — Legends

  • — Can create legends for the visualizatinos
  • — customize them with sub properties type, orient, fill, opacity, shape

  • — Transforms

  • — As the name implies it can transform data streams
  • — Has sub properties ilke filter, stack, aggregate, bin, collect, fold,
    impute etc

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.