Highcharts test tool

by Torstein Hønsi

HTML

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

<div id="container" style="min-width: 300px; height: 300px; margin: 1em"></div>

JavaScript

$('#container').highcharts({
    
    chart: {
        type: 'column',
        events: {
            load: function () {
                var label = this.renderer.label("This text will adjust to chart resizing " +
                    "and redraws and will be visible on exported images.")
                .css({
                    width: '180px'
                })
                .attr({
                    'stroke': 'silver',
                    'stroke-width': 1,
                    'r': 5,
                    'padding': 10
                })
                .add();
                
                label.align(Highcharts.extend(label.getBBox(), {
                    align: 'right',
                    x: 0, // offset
                    verticalAlign: 'bottom',
                    y: 0 // offset
                }), null, 'spacingBox');
                
            }
        },
        marginRight: 220
    },

    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 
            'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },
    
    legend: {
        align: 'right',
        verticalAlign: 'top',
        y: 100
    },

    series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
    }]

});