Highcharts Demo

author(s): Torstein Hønsi

by Rikin Patel

HTML

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

<div id="container" style="height: 400px; width: 500px"></div>

JavaScript

$(function () {
    Highcharts.chart('container', {
        chart: {
            type: 'column',
            borderWidth: 1
        },

        title: {
            text: 'No space reserved for X axis labels'
        },

        credits: {
            enabled: false
        },

        legend: {
            enabled: false
        },

        xAxis: {
            categories: ['Product 1', 'Product 2', 'Yet another product'],
            labels: {
                rotation: -90,
                align: 'left',
                reserveSpace: false,
                y: -5,
                style: {
                    color: '#FFFFFF',
                    fontSize: '12pt',
                    fontWeight: 'bold',
                    textOutline: '1px contrast'
                }
            },
            tickWidth: 0
        },

        series: [{
            data: [39.9, 71.5, 106.4],
            dataLabels: {
                enabled: true
            }
        }]
    });
});