Highcharts - horizontal Bar Chart
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; max-width: 800px; height: 400px; margin: 0 auto"></div>
JavaScript
$(function() {
$('#container').highcharts({
chart: {
type: 'bar'
},
title: {
text: 'Sky Offers'
},
/*subtitle: {
text: 'Source: Multi Devis'
},*/
xAxis: {
categories: ['Orders16'],
labels: {
enabled: true,
align: 'center',
style: {"visibility": "hidden"}
},
zIndex: 0,
title: {
text: null
}
},
yAxis: {
min: 0,
title: {
text: '2016',
align: 'high'
},
labels: {
overflow: 'justify'
}
},
tooltip: {
valueSuffix: ' €'
},
plotOptions: {
series: {
groupPadding: 1
},
bar: {
pointWidth: 20,
dataLabels: {
enabled: true
}
}
},
legend: {
layout: 'vertical',
align: 'left',
verticalAlign: 'top',
useHTML: true,
x: -10,
y: -10,
floating: true,
borderWidth: 1,
backgroundColor: ((Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'),
//backgroundColor: '#000000',
shadow: false,
zIndex: 10
},
credits: {
enabled: false
},
series: [{
name: 'Jan',
data: [771911]
}, {
name: 'Feb',
data: [976040]
},
}]
});
});