JSFiddle - React, Tailwind, and code Playground
by xmlilley
HTML
<script src="http://code.highcharts.com/highcharts.js"></script>
<div id="container" style="height: 400px"></div>
JavaScript
$(function () {
$('#container').highcharts({
chart: {
type: 'column',
height: 300,
width: 350,
style: {
top: '-10px'
}
},
series: [{
name: 'AP',
data: [ 89, 87, 91, 93, 97 ]
}],
plotOptions: {
column: {
pointPadding: 0.1,
groupPadding: 0.1,
dataLabels: {
enabled: true,
inside: true,
rotation: 0,
color: '#FFFFFF',
align: 'center',
x: 0,
y: 0,
padding: 0,
style: {
fontSize: '11px'
}
}
}
},
yAxis: {
plotLines: [{value: 95}],
max: 100
},
xAxis: {
categories: ["Q1 '12", "Q2 '12", "Q3 '12", "Q4 '12", "Q1 '13"]
}
})
})