HeatMap
Ready for production
Responsive
Simple Use
Show Code
Edit on Stackblitz
With explicit height and width
123456789101112
789101112123456
131415161718145784
145784131415161718
Responsive
123456789101112
789101112123456
131415161718145784
145784131415161718
Disabled
Show Code
Edit on Stackblitz
When disabled, cells are not clickable
123456789101112
789101112123456
131415161718145784
145784131415161718
Themes
Show Code
Edit on Stackblitz
The following are responsive
Primary
123456789101112
789101112123456
131415161718145784
145784131415161718
Secondary
123456789101112
789101112123456
131415161718145784
145784131415161718
Dark
123456789101112
789101112123456
131415161718145784
145784131415161718
Light
123456789101112
789101112123456
131415161718145784
145784131415161718
Info
123456789101112
789101112123456
131415161718145784
145784131415161718
Warning
123456789101112
789101112123456
131415161718145784
145784131415161718
Danger
123456789101112
789101112123456
131415161718145784
145784131415161718
Success
123456789101112
789101112123456
131415161718145784
145784131415161718
Custom Color
123456789101112
789101112123456
131415161718145784
145784131415161718
Events
Show Code
Edit on Stackblitz
Check console for event log
123456789101112
789101112123456
131415161718145784
145784131415161718
Declaration Code
Show Code
Edit on Stackblitz
Declarative code does not add any background to the heat map. Its upto you to add that
1234
4321
10654
5720