Highcharts Demo

author(s): Torstein Hønsi

by jeffgw

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" style="height: 500px; min-width: 310px; max-width: 800px; margin: 0 auto"></div>

JavaScript

Highcharts.chart('container', {

    chart: {
        type: 'heatmap',
        marginTop: 40,
        marginBottom: 80,
        plotBorderWidth: 1
    },


    title: {
        text: 'IMD Tech Workorder Details'
    },
		credits:{
    	enabled: false
    },
    yAxis: {
        categories: ['Chadsidy R Sanders', 'Christian J Beyer', 'Crystal C Voiles', 'Evangeline A Bowen', 'Jacob L Falling', 'Jeff G Wrobel', 'Jeffery W Roberson', 'Justin P Medlin', 'Lawrence Garcia', 'Margarete Sanchez', 'Margarita Moreland', 'Mathias B Moser', 'Nathan C Wilson', 'Roger P Franz', 'Timothy M Taylor'],
        title: null
    },

    xAxis: {
        categories: ['Jan-18', 'Feb-18', 'Mar-18', 'Apr-18', 'May-18', 'Jun-18', 'Jul-18', 'Aug-18', 'Sep-18', 'Oct-18', 'Nov-18', 'Dec-18', 'Jan-19', 'Feb-19', 'Mar-19', 'Apr-19', 'May-19', 'Jun-19', 'Jul-19', 'Aug-19', 'Sep-19'],
        
    },

    colorAxis: {
        min: 0,
        minColor: '#FFFFFF',
        maxColor: Highcharts.getOptions().colors[0]
    },

    legend: {
        align: 'right',
        layout: 'vertical',
        margin: 0,
        verticalAlign: 'top',
        y: 25,
        symbolHeight: 280
    },

    tooltip: {
        formatter: function () {
            return '<b>' + this.series.yAxis.categories[this.point.y] + '</b> completed <b>' +
                this.point.value + '</b> work orders in <b>' +  this.series.xAxis.categories[this.point.x]+'</b>';
        }
    },

    series: [{
        name: 'Work orders',
        borderWidth: 1,
        data: [[0, 0, 119], [0, 1, 30], [0, 9, 14], [0, 10, 1], [0, 11, 20], [0, 13, 21], [0, 14, 67], [1, 0, 75], [1, 1, 13], [1, 3, 1], [1, 9, 9], [1, 11, 23], [1, 13, 16], [1, 14, 84], [2, 0, 83], [2, 1, 20], [2, 3, 37], [2, 4, 1], [2, 9, 21], [2, 11, 22], [2, 13, 12], [2, 14, 99], [3, 0, 29], [3, 1, 16], [3, 3, 38], [3, 9, 10], [3, 11, 20], [3, 13, 9], [3, 14, 85], [4, 0, 77], [4, 1, 14], [4, 3, 39], [4, 9, 11], [4, 11, 19], [4, 13, 18], [4, 14, 106], [5, 0, 66], [5, 1, 30],...