Skip to content

Instantly share code, notes, and snippets.

@mattheu

mattheu/gist:03a70a93db081b8b90e8dfa92fd7e5fc

Last active January 22, 2018 14:31
Show Gist options
  • Save mattheu/03a70a93db081b8b90e8dfa92fd7e5fc to your computer and use it in GitHub Desktop.
Save mattheu/03a70a93db081b8b90e8dfa92fd7e5fc to your computer and use it in GitHub Desktop.
Download ZIP
Raw
gistfile1.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<style>body, html { background: rgba(0,0,0,0.05); padding: 0; margin: 0; }</style>
</head>
<body>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/data.js"></script>
<div id="container" style="height: 600px"></div>
<script>
// Create the chart
Highcharts.chart('container', {
chart: {
type: 'column',
backgroundColor: '#eeeeee'
},
title: {
text: '2017 General Election Results'
},
legend: {
enabled: false
},
plotOptions: {
series: {
borderWidth: 0,
}
},
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/>'
},
xAxis: {
categories: ['Conservative', 'Labour', 'Other']
},
series: [{
name: 'Results',
colorByPoint: true,
data: [{
name: 'Conservative',
y: 48.8,
color: '#0096db'
}, {
name: 'Labour',
y: 40.3,
color: '#e4003b'
}, {
name: 'Other',
y: 13.8,
color: 'grey'
}]
}],
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment