Vega-Lite

A Flourish template based on Vega-Lite capable of creating all kinds of charts, and transforming data on the fly

Updated 15 hours ago to v2.0.0 by Flourish team

How to use this template

How to use this template

Vega-Lite

A template to unlock the power of Vega-Lite visualisations in Flourish.

Vega-Lite lets you concisely specify interactive visualisations in JSON syntax, and has a wide range of chart types.

To build your own Vega-Lite charts in Flourish:

  • Upload your data, and update the Data binding to point to the columns for use in the visualisation.
  • Choose an example from the Vega-Lite examples gallery. Copy the JSON used in the example, and paste it into the Vega-lite code setting field.
  • Delete the $schema, description, height, width and data fields.
  • In the encoding field, update the field names to point at the names of your bound columns.

For example, if you were building a Vega-lite simple bar chart, and you had CSV data like this:

customer,sales
robin,17825
duncan,78124
tim,98724

You would need to bind columns A-B in your data, then use the following JSON:

{
  "mark": "bar",
  "encoding": {
    "x": {"field": "customer", "type": "ordinal"},
    "y": {"field": "sales", "type": "quantitative"}
  }
}

For more advanced options, see the blog post and the Vega-lite documentation.