Skip to content

Instantly share code, notes, and snippets.

@auremoser
Last active October 19, 2017 20:29
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save auremoser/17470dd8083b966f0811e8f50522887c to your computer and use it in GitHub Desktop.
Save auremoser/17470dd8083b966f0811e8f50522887c to your computer and use it in GitHub Desktop.
Combination Highchart
<!DOCTYPE html>
<html>
<head>
<title>Licensing Center Customer Data</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>Licensing Center Customer Data</h2>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
<script>
$(function () {
Highcharts.chart('container', {
chart: {
zoomType: 'xy'
},
title: {
text: 'Licensing Center Customer Data'
},
xAxis: {
categories: ['Aug', 'Sep', 'Oct', 'Nov', 'Dec', 'Jan',
'Feb', 'Mar', 'Apr', 'May', 'Jun']
},
plotOptions: {
column: {
stacking: 'normal',
}
},
series: [{
type: 'column',
name: 'Average Transaction Time',
data: [11.3, 11, 11.4, 11.2, 11.4, 11.7, 10.7, 10.8, 10.5, 11, 11.3]
}, {
type: 'column',
name: 'Average Wait Time',
data: [10.6, 7.7, 3.8, 5.1, 4.4, 6.6, 8.5, 14.9, 11.2, 10.4, 6.5]
}, {
type: 'spline',
name: 'Customers Served',
//original data
// data: [7758, 7870, 6712,5669, 6489, 5225, 6496, 9072, 8275, 7452, 6740],
// divide by factor of 1000
// data: [7.758, 7.870, 6.712, 5.669, 6.489, 5.225, 6.496, 9.072, 8.275, 7.452, 6.740],
// divide by 365, customers per day on average, per year
data: [21, 21, 18, 15, 18, 14, 18, 25, 23, 20, 18],
marker: {
lineWidth: 2,
lineColor: Highcharts.getOptions().colors[3],
fillColor: 'white'
}
}]
});
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment