Heatmaps encode numeric values as cell colors in a two-dimensional grid, making it easy to spot patterns, clusters, and outliers across two categorical dimensions at once. Sequential color scales work for single-direction data, while diverging scales are ideal for correlation matrices and variables that range from negative to positive.

Subtype

▾

Live Preview

day	hour	calls
Mon	9am	42
Mon	11am	68
Mon	1pm	91
Mon	3pm	74
Mon	5pm	38
Tue	9am	38
Tue	11am	72
Tue	1pm	88
Tue	3pm	81
Tue	5pm	45

{
  "title": {
    "text": "Call Center Volume by Day & Hour"
  },
  "data": [
    {
      "day": "Mon",
      "hour": "9am",
      "calls": 42
    },
    {
      "day": "Mon",
      "hour": "11am",
      "calls": 68
    },
    {
      "day": "Mon",
      "hour": "1pm",
      "calls": 91
    },
    {
      "day": "Mon",
      "hour": "3pm",
      "calls": 74
    },
    {
      "day": "Mon",
      "hour": "5pm",
      "calls": 38
    },
    {
      "day": "Tue",
      "hour": "9am",
      "calls": 38
    },
    {
      "day": "Tue",
      "hour": "11am",
      "calls": 72
    },
    {
      "day": "Tue",
      "hour": "1pm",
      "calls": 88
    },
    {
      "day": "Tue",
      "hour": "3pm",
      "calls": 81
    },
    {
      "day": "Tue",
      "hour": "5pm",
      "calls": 45
    },
    {
      "day": "Wed",
      "hour": "9am",
      "calls": 51
    },
    {
      "day": "Wed",
      "hour": "11am",
      "calls": 79
    },
    {
      "day": "Wed",
      "hour": "1pm",
      "calls": 96
    },
    {
      "day": "Wed",
      "hour": "3pm",
      "calls": 83
    },
    {
      "day": "Wed",
      "hour": "5pm",
      "calls": 52
    },
    {
      "day": "Thu",
      "hour": "9am",
      "calls": 46
    },
    {
      "day": "Thu",
      "hour": "11am",
      "calls": 71
    },
    {
      "day": "Thu",
      "hour": "1pm",
      "calls": 85
    },
    {
      "day": "Thu",
      "hour": "3pm",
      "calls": 78
    },
    {
      "day": "Thu",
      "hour": "5pm",
      "calls": 41
    },
    {
      "day": "Fri",
      "hour": "9am",
      "calls": 35
    },
    {
      "day": "Fri",
      "hour": "11am",
      "calls": 62
    },
    {
      "day": "Fri",
      "hour": "1pm",
      "calls": 74
    },
    {
      "day": "Fri",
      "hour": "3pm",
      "calls": 58
    },
    {
      "day": "Fri",
      "hour": "5pm",
      "calls": 22
    }
  ],
  "series": [
    {
      "type": "heatmap",
      "xKey": "day",
      "yKey": "hour",
      "valueKey": "calls"
    }
  ],
  "colorScale": {
    "scheme": "sequential"
  }
}

Edit JSON above · auto-previews after 0.9 s

A 5x5 grid showing hourly call center volume by day of week — hot spots reveal peak staffing needs.

PreviousGauge Charts Next Candlestick Charts

Was this article helpful?