Cource Completion

by Kondal Durgam

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

Highcharts.chart('container', {
    chart: {
        type: 'column'
    },
   colors: ['#a9d18e', '#a9d18e', '#a9d18e', '#c00000', '#a9d18e', 
   '#a9d18e', '#c00000', '#a9d18e', '#a9d18e'],

    plotOptions: {
        column: {
            colorByPoint: true
        }
    },
    title: {
        text: 'Cource Completion',
        align: 'left',
        x: 30,
        y:30
    },
    xAxis: {
        type: 'category',
        
    },
     credits: {
             enabled: false
            },
            exporting: { 
              enabled: false
             },
    yAxis: {
        min: 0,
        title: {
            text: ''
        },
         plotLines: [{
                value: 1500.00,
                color: 'Green',
                dashStyle: 'shortdash',
                width: 2,
                label: {
                    text: 'Capacity',
                    align: 'right',
                    //x:-60,
                    //y:-150,
                    style: {
                        color: 'Green',
                    }
                }
            }]
    },
    legend: {
        enabled: false
    },
    
    series: [{
        name: 'Completion',
        data: [
            ['Registered', 2000],
            ['Shortlisted', 1600],
            ['Confirmed', 1400],
            ['No Show', 100],
            ['Completed', 1300],
            ['Passed', 1200],
            ['Failed', 110],
            ['Employed',900],
            ['employed',900] 
        ],
    }]
});