Skip to content

mmontesanonyc/vega-lite-library

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

41 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Vega-Lite Library

This repo is a small personal library of useful visualization approaches with Vega-Lite. Basically, I needed to keep things in one place as I learned, experimented, and wound up settling or finding useful techniques. This is the place.

This repo uses:

Pages

This will probably get out of date pretty soon, but:

Techniques

A lot of these are shown pretty simply and clearly in each page, but here's a quick summary.

Using a named data source

Using a named data source gives us more opportunities to manipulate the source of the data (that is, importing data into the browser, manipulating it using JavaScript, and delivering it to the chart - rather than relying on a precisely-formatted CSV).

Filtering by time in a file

Essentially we're using layer.transform as transform": [{"filter": "datum.date_of_interest > 0"} and then subbing out that 0 for a value we calculate. (Note that with a bar-and-line chart, having two layers, we need to have this filter on both layers.)

Calculating within a file

We can calculate in transform.calculate, but we need to use parseFloat() for it to work. The below does the trick, essentially creating a new calculated field of TOTAL_CASE_COUNT that we can use to chart.

"transform": [
 {"calculate": "parseFloat(datum.CASE_COUNT) + parseFloat(datum.PROBABLE_CASE_COUNT)", "as": "TOTAL_CASE_COUNT"}
 ],

Using Arquero

A lot of these examples bring data in using Arquero. This plus using named data sources should let us do a lot more manipulation within the browser.

Map things

  • Map with highlight-on-hover
  • Map and bar

Other layout stuff

  • Sorted bar charts
  • Vertical concatenation (useful for small multiples)

To do list

  • Continue documentation
  • Double-bounded range slider
  • Template out stuff like:
    • bar with highlight (in progress)
    • small multiples with mutual highlighting
    • map-and-bar with mutual highlighting
    • populate a selection menu using Arquero's dt.columns()

About

Prepping, testing, learning, and templating.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published