Giter VIP home page Giter VIP logo

compass's Introduction

Vega: A Visualization Grammar

Vega Examples

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 later versions, please refer to the Vega Porting Guide.

Build Instructions

For a basic setup allowing you to build Vega and run examples:

  • Clone https://github.com/vega/vega.
  • Run yarn to install dependencies for all packages. If you don't have yarn installed, see https://yarnpkg.com/en/docs/install. We use Yarn workspaces to manage multiple packages within this monorepo.
  • Once installation is complete, run yarn test to run test cases, or run yarn build to build output files for all packages.
  • After running either yarn test or yarn build, run yarn serve to launch a local web server — your default browser will open and you can browse to the "test" folder to view test specifications.

This repository includes the Vega website and documentation in the docs folder. To launch the website locally, first run bundle install in the docs folder to install the necessary Jekyll libraries. Afterwards, use yarn docs to build the documentation and launch a local webserver. After launching, you can open http://127.0.0.1:4000/vega/ to see the website.

Internet Explorer Support

For backwards compatibility, Vega includes a babel-ified IE-compatible version of the code in the packages/vega/build-es5 directory. Older browser would also require several polyfill libraries:

<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-polyfill/7.4.4/polyfill.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/runtime.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/fetch.umd.min.js"></script>

Contributions, Development, and Support

Interested in contributing to Vega? Please see our contribution and development guidelines, subject to our code of conduct.

Looking for support, or interested in sharing examples and tips? Post to the Vega discussion forum or join the Vega slack organization! We also have examples available as Observable notebooks.

If you're curious about system performance, see some in-browser benchmarks. Read about future plans in our roadmap.

compass's People

Contributors

domoritz avatar jpocom avatar kadamwhite avatar kanitw avatar yhoonkim avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

compass's Issues

Small Multiple Support

  • 1 layer faceting ( x – cross )
  • 1 layer faceting ( + – concat )
  • multi-layer faceting
  • labels

Histogram Basic

  • chart support — given an array of binned data e.g., [1,1,1,1,1,1,2,2,2,2,3,3,3,4,4,5,5,5,5,5,5,5] count unique values and plot histogram. (Zening)
  • Extend Datavore to call binning — see vizrec code (Ham)

Restricts Transformations when multiple Qs are presented.

Specifically, only apply bins to all of them, or aggregation to all of them or do nothing (raw).

Currently if we have *(Q1) and *(Q2) selected, we get all the following

  • Q1 x Q2
  • AVG(Q1) x AVG(Q2)
  • BIN(Q1) x BIN(Q2)
  • AVG(Q1) x BIN(Q2)
  • BIN(Q1) x AVG(Q2)
  • We shouldn’t include the latter two unless the user explicitly specifies that they want BIN.
  • for BIN(Q1) x BIN(Q2), we should automatically add count to the table (so we get heat map or table of circular sizes..)

Question:

  • What should we do if users specify MIN(Q1), *(Q2)?

should we generate BIN and MIN or BIN and AVG for Q2

Line Chart Basic

  • Support Year only

** Advance **

  • Support Multi Level Expansion (Year -> Month -> Day)

Map Basic

  • Start by prototyping symbol map of USA (by states) separately

Optimize Performance

Asking for “major_genre”, “imdb_votes”, “production_budget” takes 6 sec

(maybe due to the fact that some visualizations are being rendered too.)

A case for OxOxQ

Effect__Amount_of_damage (O)
When__Phase_of_flight (O)
avg Cost__Total_$ (Q)

is

bar.y-Effect__Amount_of_damage-O.color-When__Phase_of_flight-O.x-avg_Cost__Total_$-Q

visrec_demo

worse than

visrec_demo

point.x-Effect__Amount_of_damage-O.y-When__Phase_of_flight-O.size-avg_Cost__Total_$-Q

Systematically Evaluate Ranking for Pruned Set

Generate some tables like:

univariate

  • Q
  • T
  • O —> becomes OxT

bivariate

  • QxQ
  • QxT
  • QxOs
  • QxOb
  • Qx#
  • TxOs
  • TxOb
  • Tx#
  • OxO —> becomes OxOx#
  • Ox#

trivariate

  • Q x Q x Q
  • Q x Q x T
  • Q x Q x Os
  • Q x Q x Ob
  • Q x Q x #
  • Q x T x Os
  • Q x T x Ob
  • Q x T x #
  • Q x Os x Os
  • Q x Os x Ob
  • Q x Ob x Ob
  • Q x Os x #
  • Q x Ob x #
  • T x Os x Os
  • T x Os x Ob
  • T x Ob x Ob
  • T x Os x #
  • T x Ob x #
  • Os x Os x #
  • Ob x Os x #
  • Ob x Ob x #

Note: Ob = high cardinality ordinal, Os = low cardinality ordinal

(We can further improve ranking with the non-pruned set after the deadline)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.