Skip to content

Instantly share code, notes, and snippets.

@auremoser

auremoser/index.html

Created October 29, 2016 23:01
Show Gist options
  • Save auremoser/c9424b2684a4541402d0a17c5975660d to your computer and use it in GitHub Desktop.
Save auremoser/c9424b2684a4541402d0a17c5975660d to your computer and use it in GitHub Desktop.
Download ZIP
Highcharts Gun Deaths
Raw
readme.md
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<title>Gun Deaths Worldwide</title>
<!-- Load JQuery -->
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<meta charset="utf-8">
<style>
</style>
</head>
<body>
<h2>Gun Deaths Worldwide</h2>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
<script>
$(function () {
$('#container').highcharts({
chart: {
type: 'bar'
},
title: {
text: 'Gun Deaths Worldwide'
},
subtitle: {
text: 'Source: <a href="http://www.motherjones.com/politics/2014/12/gun-violence-car-deaths-charts">Mother Jones</a>'
},
xAxis: {
categories: ['USA', 'Finland', 'Switzerland', 'Austria', 'France', 'Canada', 'Norway', 'Israel', 'Belgium', 'Sweden', 'Denmark', 'Italy'],
title: {
text: null
}
},
yAxis: {
min: 0,
title: {
text: 'Population (millions)',
align: 'high'
},
labels: {
overflow: 'justify'
}
},
tooltip: {
valueSuffix: ' Deaths/100,000 population'
},
plotOptions: {
bar: {
dataLabels: {
enabled: true
}
}
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'top',
x: -40,
y: 20,
floating: true,
borderWidth: 1,
backgroundColor: ((Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'),
shadow: true
},
credits: {
enabled: false
},
series: [{
name: 'Suicide',
data: [2.85, 0.35, 0.32, 0.09, 0.23, 0.5]
}, {
name: 'Homicide',
data: [6.3, 2.75, 2.6, 2.1, 2, 2.2]
}]
});
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment