Highcharts Demo

author(s): Torstein Hønsi

HTML

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/series-label.js"></script>


<div id="container"></div>

CSS

#container {
	min-width: 310px;
	max-width: 800px;
	height: 400px;
	margin: 0 auto
}

JavaScript

Highcharts.chart('container', {
                title: {
                    text: 'class marks',
                    x: -20 //center
                },
                xAxis: {
                    categories: ["2019-02-07","2019-02-08","2019-02-09","2019-02-12","2019-02-13","2019-02-14"]
                },
                yAxis: {
                    title: {
                        text: 'Marks'
                    },
                    plotLines: [{
                        value: 0,
                        width: 1,
                        color: '#808080'
                    }]
                },
                legend: {
                    layout: 'vertical',
                    align: 'right',
                    verticalAlign: 'middle',
                    borderWidth: 0
                },
                series: [{"name":"class 1","data":[45,0,166,78,0,0]},{"name":"class 2","data":[0,64,0,64,627,0]},{"name":"class 3","data":[0,0,0,0,87,352]}]
            });