Charts / Heatmap

Heatmap

A grid where cell colour encodes a numeric value. Reveals patterns across two categorical axes.

Activity

View

Palette

Data shape

Pass this structure to the :data prop.

data shape

[
    ['x' => 'Mon', 'y' => '9am',  'value' => 74],
    ['x' => 'Mon', 'y' => '10am', 'value' => 55],
    ['x' => 'Tue', 'y' => '9am',  'value' => 90],
]

Usage

blade

<x-tayo::chart
    type="heatmap"
    :data="$data"
    :height="420"
    colors="default"
/>

Radar Treemap