JOB PRFERENCE
COLLEGE DASHBOARD
by Kondal Durgam
HTML
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/data.js"></script>
<script src="https://code.highcharts.com/modules/drilldown.js"></script>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
JavaScript
// Create the chart
Highcharts.chart('container', {
chart: {
type: 'column'
},
title: {
text: ''
},
credits: {
enabled: false
},
exporting: {
enabled: false
},
subtitle: {
text: ''
},
xAxis: {
type: 'category'
},
yAxis: {
title: {
text: ''
}
},
legend: {
enabled: false
},
plotOptions: {
series: {
borderWidth: 0,
dataLabels: {
enabled: true,
format: '{point.y:.1f}%'
}
}
},
tooltip: {
headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.2f}%</b> of total<br/>'
},
series: [{
name: 'Degree',
colorByPoint: true,
data: [{
name: 'BACHELOR',
color:'#1d3166',
y: 40.33,
drilldown: 'BACHELOR'
}, {
name: 'MASTER',
color:'#70d8ff',
y: 24.03,
drilldown: 'MASTER'
}, {
name: 'DIPLOMA',
color:'#92d050',
y: 10.38,
drilldown: 'DIPLOMA'
}, {
name: 'DOCTORATE',
color:'#ed7d31',
y: 4.77,
drilldown: 'DOCTORATE'
}]
}],
drilldown: {
series: [{
name: 'BACHELOR',
id: 'BACHELORr',
data: [
[
'v11.0',
24.13
],
[
'v8.0',
17.2
],
[
'v9.0',
8.11
],
[
'v10.0',
5.33
],
[
'v6.0',
...