Num of Play / DAU
by Hoang_Van_Trinh
HTML
<script src="https://code.highcharts.com/stock/highstock.js"></script>
<script src="https://code.highcharts.com/stock/modules/exporting.js"></script>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
JavaScript
$(function () {
$('#container').highcharts({
rangeSelector: {
selected: 1
},
title: {
text: 'DAU Report',
align: 'left',
margin: 60,
x: 20
},
plotOptions: {
series: {
pointPadding: 0, // Defaults to 0.1
groupPadding: 0.2 // Defaults to 0.2
}
},
scrollbar: {
barBackgroundColor: 'gray',
barBorderRadius: 7,
barBorderWidth: 0,
buttonBackgroundColor: 'gray',
buttonBorderWidth: 0,
buttonBorderRadius: 7,
trackBackgroundColor: 'none',
trackBorderWidth: 1,
trackBorderRadius: 8,
trackBorderColor: '#CCC',
enabled: true
},
xAxis: {
categories: ['06/02/16', '06/03/16', '06/04/16', '06/05/16', '06/06/16', '06/07/16', '06/08/16', '06/09/16', '06/10/16', '06/11/16'],
min: 0,
max: 3
},
yAxis: [{ // Primary yAxis
labels: {
format: '{value}',
style: {
color: Highcharts.getOptions().colors[1]
}
},
title: {
text: 'User',
style: {
color: Highcharts.getOptions().colors[1]
}
}
}, { // Secondary yAxis
title: {
text: 'Num of Play / DAU',
style: {
color: Highcharts.getOptions().colors[0]
}
},
labels: {
format: '{value}',
style: {
color: Highcharts.getOptions().colors[0]
}
},
opposite: true
}],
legend: {
align: 'top',
x: 20,
...