Highcharts Demo

author(s): Torstein Hønsi

by joseph8691

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/heatmap.js"></script>
<div id="container" style="height: 580px; min-width: 250px; max-width: 800px; margin: 0 auto"></div>

JavaScript

$(function () {

    $('#container').highcharts({

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


        title: {
            text: 'S&P 500 Sector DIVCON Score (2001-2014)'
        },

        xAxis: {
            categories: ['2001', '2002', '2003', '2004', '2005', '2006', '2007', '2008', '2009', '2010', '2011', '2012', '2013', '2014']
        },

        yAxis: {
            categories: ['Tele. Serv.', 'Energy', 'Utilities', 'Materials', 'Financials', 'Health Care', 'Cons. Disc.', 'Cons. Stap.', 'Info. Tech.', 'Industrials', 'S&P 500 Index'],
            title: null
        },

        colorAxis: {
            stops: [
                [0.4, '#e64a45'],
                [0.6, '#f2c249'],
                [0.8, '#65bd6f']
            ],
            min: 32,
            max: 60
        },

        legend: {
            align: 'right',
            layout: 'horizontal',
            margin: 100,
            verticalAlign: 'bottom',
            y: 5,
            symbolHeight: 6
        },

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

        series: [{
            name: 'DIVCON Scores',
            borderWidth: 0,
            data: [
                [0, 10, 45.3],
                [1, 10, 47.4],
                [2, 10, 47.7],
                [3, 10, 48.8],
                [4, 10, 49],
                [5, 10, 49.9],
                [6, 10, 49.4],
                [7, 10, 51.4],
                [8, 10, 49.1],
                [9, 10, 52.9],
                [10, 10, 53],
                [11, 10, 51.2],
                [12, 10, 52],
                [13, 10, 53.6],
                [0, 9, 43.1],
                [1, 9, 46.5],
                [2, 9, 46.6],
                [3, 9, 50.6],
           ...