Skip to content



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


  • tile: heatmap
  • title
  • display:
    • span: Display the span within heatmap
  • exp: Any date expression; it should be(today or any date)e.g(exp: 'today'). Starting day in the charts
  • span: number; (it represents the number of cells to be display in the heatmap)e.g(span: 365) if span 365 then display 365 day[cells] on the heatMap
  • connect: [connection objects]
    • standard fields
    • source
  • mode: week | isoweek.By default, is isoWeek. Display week based on that in the chart.
  • tooltipText: Provide a text to be display in tooltip between the records and date based on a different heatmap.By default, is display "|".
  • heatmap: [Additional connect configuration Object]
    • timeSeries: any expression; e.g YYYY-MM-DD (if time series)
    • title

Data source

"dataSources": [
      "id": "data",
      "query": "given trackers[data] from 2020-Aug as month"


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

Complete Example

  "tile": "heatmap",
  "title": "Total",
  "display": {
    "span": "12"
  "exp": "today",
  "heatmap": {
    "timeSeries": "YYYY-MM-DD; YYYY-MM-DD; P1D",
    "title": "time by day"
  "mode": "week",
  "connect": [
      "title": "Wellness Questionnaire",
      "source": "wellness",
      "pick": "1",
      "apply": "sum(ls)",
      "state": "result >= 1",
      "format": "0,0",
      "options": {
        "background": "#5DB354",
        "message": "Wellness check in",
        "icon": "user-check fas",
        "show": "count",
        "singular": "Complete!",
        "plural": "entries",
        "zero": "No entries",
        "dispatch": {
          "tracker": "wellness",
          "features": {
            "users": "hidden",
            "time": "hidden"