Highcharts Demo

author(s): Kamil Kulig

by Rajesh Danabal

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/heatmap.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

<div id="container"></div>

CSS

#container {
	min-width: 350px;
	max-width: 600px;
	margin: 0 auto;
}

JavaScript

Highcharts.chart('container', {

    chart: {
        type: 'heatmap'
    },

    colorAxis: {
        min: 0
    },

    series: [{
        pointPlacement: 'number',
        pointRange: 1,
        data: [
            [0, 0, 5],
            [0, 1, 2],
            [1, 0, 6],
            [1, 1, 1],
            [2, 0, 9],
            [2, 1, 3]
        ]
    }],

    title: {
        text: 'pointPlacement option in heatmap'
    }

});