User Guide

Vega & Vega-Lite

Vega & Vega-Lite

screen-shot-2016-10-20-at-11-17-01-am

Vega & Vega-Lite

What is Vega?

Vega is a declarative format for creating, saving, and sharing visualisation designs. With Vega, visualisations are described in JSON, and generate interactive views using either HTML5 Canvas or SVG.

 

How does Vega fit in with D3?

“Vega provides a higher-level visualization specification language on top of D3. By design, D3 will maintain an “expressivity advantage” and in many cases will be better suited for novel, highly interactive graphics. On the other hand, we hope that Vega will be convenient for a wide range of common yet customizable visualizations Toolkits”

Learn more about the relationship between Vega and D3.

 

What is Vega 2.0?

“Vega 2.0 offers a full declarative visualization grammar, suitable for expressive custom interactive visualization design and programmatic generation.”

Find out more about Vega by taking a look at Vega’s online editor and example, documentation and Github site.

 

Example

Vega’s online editor and an example visualisation:
screen-shot-2016-10-25-at-10-11-22-am

 

What is Vega-light?

“Vega-Lite is a high-level visualization grammar. It provides a concise JSON syntax for supporting rapid generation of visualizations to support analysis. Vega-Lite specifications can be compiled to Vega specifications.”

Learn more about Vega-Lite by taking a look at the online editor, examples, documentation and GitHub site.

 

Example

Here is a Vega-Lite specification for a bar chart that shows the average monthly temperature in Seattle:

screen-shot-2016-10-20-at-11-19-28-am

 {
 "data": {"url": "data/seattle-temps.csv"},
 "mark": "bar",
 "encoding": {
    "x": {
     "timeUnit": "month",
     "field": "date",
     "type": "temporal",
     "axis": {"shortTimeLabels": true}
   },
   "y": {
     "aggregate": "mean",
     "field": "temp",
     "type": "quantitative"
    }
  }
}

More examples for Vega-Lite may be found online.

 

Learn more about Vega-Lite

Papers from The Interactive Data Lab on Vega-Lite , are available online (pdf).

 

How to display your project in the Data Arena?

Vega projects can be displayed on a web page. It is possible to access a live site from within the Data Arena. Alternatively, it is possible for you to provide a .html file to load manually.

<< RAW | Drishti >>