Vega Viewer
Vega Viewer provides language support & Interactive Preview of Vega &
Vega-Lite JSON spec graphs 📈
You can use it in a disconnected mode, unlike other online dataViz devTools, to prototype your maps 🗺️ & graphs 📈 on a go, on a ✈️, on a 🚄, on a 🚤, in a 📦 with a 🐐,
and no d3 py plotly || rstats required! :)
Features
- Create Vega || Vega-Lite JSON
{} spec documents
- Vega & Vega-Lite Graphs Preview 📈
- Local & http(s) data files support
- SVG & PNG Graph Export options
- 660 searchable built-in Vega & Vega-Lite Examples
- Vega Themes Preview
- Load Vega specs from online Vega Editor or github gists
- Preview Vega graphs 📈 from ⭐️ Starred Gists, Playgrounds & featured Data Visualizations in GistPad 📘
- View and Share Vega(-Lite) spec in the online Vega Editor
- Referenced CSV & JSON data display via Data Preview 🈸
Settings
Install Data Preview 🈸
or use built-in vscode.open command to preivew referenced CSV & JSON data files for your Vega graphs 📈
Usage
Use Vega: Create Vega Spec command from View -> Command Pallette... menu
to Create & Save new Vega || Vega-Lite document with the corresponding Vega json $schema reference
Run Vega: Preview Vega Graph command on an open .vg.json || .vl.json Vega spec document to Preview 📈
Save updated Vega spec json document to Preview updated Graph 📈
Use Vega: Preview Remote Vega Graph command to preview URL encoded Vega specs from online
Vega Editor or github gists
Built-in Examples
Run Vega: Examples command to view the list of built-in Vega Examples
Run Vega: Lite Examples command to view all the Vega-Lite Maps 🗺 & Graphs 📈 created by the Vega dev community 🤗
Run Vega: Visual Vocabulary Examples command to View quick list of Visual Vocabulary Vega Examples
...
Vega Viewer VSCode Contributions
Vega Viewer Commands
Vega Viewer GistPad Integration
Recommended Extensions
Other extensions Vega Viewer replaces, enhances or supplements for working with data and graphs 📈 in VSCode:
| Extension |
Description |
| Data Preivew 🈸 |
Data Preview 🈸 extension for importing 📤 viewing 🔎 slicing 🔪 dicing 🎲 charting 📊 & exporting 📥 large JSON array/config, YAML, Apache Arrow, Avro & Excel data files |
| GistPad 📘 |
VS Code extension for managing and sharing code snippets, notes and interactive samples using GitHub Gists |
| SVG Viewer |
SVG Viewer for Visual Studio Code |
| Geo Data Viewer 🗺️ |
Geo Data Viewer w/0 Py 🐍, pyWidgets ⚙️, pandas 🐼, or @reactjs ⚛️ required to gen. some snazzy maps 🗺️ with keplerGL ... |
Dev Log
See #VegaViewer 📈 tag on Twitter for the latest & greatest updates on this vscode extension & what's in store next.
Dev Build
$ git clone https://github.com/RandomFractals/vscode-vega-viewer
$ cd vscode-vega-viewer
$ npm install
$ code .
F5 to launch Vega Viewer extension VSCode debug session:
Contributions
Any & all test, code || feedback contributions are welcome.
Open an issue || create a pull request to make Vega Viewer 📈 work better for all. 🤗
