Skip to content

HeatMap

A heatmap is representing time series data. Inspired by Github's contribution chart

Syntax

Data source

An array of data queries that resolve when the heatmap calendar is loaded.

  • id:String unique identifier within the layout
  • query:String Dispatch query string;

Data source segmentation

    {
      "span": 365,
      "exp": "2021-01-08",
      "heatmap": {
        "timeSeries": "YYYY-MM-DD; YYYY-MM-DD; P1D",
        "title": "time by day"
      }
    }

 ```   

=== "Definition"

 * timeSeries: expression; middle should be YYYY-MM-DD (if time series)
 * title
 * exp: any date expression; it should be(today or any date) 
   `e.g(exp: 'today')`
 * span: number; (it represent the number of column to be display in heatmap)
   `e.g(span: 365) if span 365 display 365 day on heatMap`

## Data source connections

```json
"connect": [
    {
        "title": "Data elements",
        "source": "data",
        "pick": "values.height",
        "apply": "sum(ls)",
        "format": "0,0"
    }
]

An array of connections to a data source to populate a calendar. The connection resolves to a single value per through a two step process. The pick attribute is applied to each dispatch resulting in a list of values while apply is used to turn the list of values into a single value.

Data is grouped based on the grouping or through a time series expression.

  • title:String descriptive title for use in configuration
  • source:String Data source identifier
  • pick:String an expression resolved per dispatch that results in a list of number values
  • apply:String an expression resolved list of values resolved through pick where ls refers to the value list
  • format:String format string