Bar chart (horizontal)
by Danielle Parkinson
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',
backgroundColor: '#fff',
width: 1071,
height: 900
},
credits: {
enabled: false
},
title: {
text: ' '
},
subtitle: {
text: ' '
},
xAxis: {
labels: {
style: {
fontFamily: 'Arial',
fontSize: '12px',
color: '#333333',
}
},
categories: [
'Automotive',
'Banking',
'Energy/utilities',
'Infrastructure',
'Insurance',
'Investment management',
'Life sciences',
'Manufacturing',
'Retail/consumer markets',
'Technology',
'Telecom'
],
crosshair: true
},
yAxis: {
labels: {
style: {
fontFamily: 'Arial',
fontSize: '12px',
color: '#333333',
},
},
},
tooltip: {
headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
'<td style="padding:0"><b>{point.y:.1f} mm</b></td></tr>',
footerFormat: '</table>',
shared: true,
useHTML: true
},
plotOptions: {
column: {
pointPadding: 0.1,
borderWidth: 0,
},
series: {
pointWidth: 50
}
},
series: [{
name: ' ',
color: '#483698',
data: [50, 75, 50, 25, 50, 75, 50, 25, 50, 75,...