Vega: A Visualization Grammar
Vega is a visualization grammar, a declarative format for creating, saving, and sharing interactive visualization designs. With Vega you can describe data visualizations in a JSON format, and generate interactive views using either HTML5 Canvas or SVG.
For documentation, tutorials, and examples, see the Vega website. For a description of changes between Vega 2 and Vega 3, please refer to the Vega 3 Porting Guide. Additional API documentation for Vega 3 can be found in the associated modules listed below.
Are you using Vega in a web application built with a bundler such as Webpack or Browserify? If so, and you do not need server-side rendering support, you might prefer using vega-lib to include Vega in your app.
For a basic setup allowing you to build Vega and run examples:
yarnto install dependencies. If you don't have yarn installed, see https://yarnpkg.com/en/docs/install.
- If you do not wish to install yarn, you can alternatively run
npm install. However, you will not be guaranteed to have dependencies matching those of the current release.
- Once installation is complete, use
npm run testto run tests and
npm run buildto build output files.
This repo (
vega) includes web-based demos within the
test folder. To run
these, launch a local webserver in the top-level directory for the repo
python -m SimpleHTTPServer 8000 for Python 2,
python -m http.server 8000 for Python 3) and then point your browser to
the right place (e.g.,
This repo also includes the website and documentation in the
docs folder. To
launch it, run
bundle install and
bundle exec jekyll serve in the
folder. The last command launches a local webserver. Now, you can open
http://127.0.0.1:4000/vega/ to see the
For a more advanced development setup in which you will be working on multiple modules simultaneously, first clone the relevant Vega 3 modules. Here is a list of all Vega 3 repositories:
Though not strictly required, we recommend using
npm link to connect each
local copy of a repo with its 'vega-' dependencies. That way, any edits you
make in one repo will be immediately reflected within dependent repos,
For example, to link vega-dataflow for use by other repos, do the following:
# register a link to vega-dataflow cd vega-dataflow; npm link # update vega-runtime to use the linked version of vega-dataflow cd ../vega-runtime; npm link vega-dataflow # update vega to use the linked version of vega-dataflow cd ../vega; npm link vega-dataflow
Once links have been setup, you can use
npm install as usual to gather all