Highcharts ages survey

by Kieran Dang

HTML

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

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

JavaScript

$(function () {
    $('#container').highcharts({
        chart: {
            type: 'column'
        },
        title: {
            text: 'Thống kê nhóm tuổi'
        },
        xAxis: {
            categories: [
                'Dưới 20',
                'Từ 20–25 tuổi',
                'Từ 25–30 tuổi',
                'Từ 30–40 tuổi',
                'Từ 40–50 tuổi',
                'Trên 50 tuổi'
            ],
            crosshair: true
        },
        yAxis: {
            min: 0,
            title: {
                text: 'Frequency'
            }
        },
        tooltip: {
            shared: true
        },
        plotOptions: {
            column: {
                pointPadding: 0.2,
                borderWidth: 0
            },
        series: {
            shadow:false,
            borderWidth:0,
            dataLabels:{
                enabled:true,
                formatter:function() {
                    var pcnt = (this.y / 201) * 100;
                    return Highcharts.numberFormat(pcnt, 1) + '%';
                }
            }
        }
        },
        series: [{
            data: [12, 56, 67, 53, 10, 3]

        }]
    });
});