I am using Google Charts for a simple Area Chart. I have many points to draw, i would like to set the interval between them. At the moment there is a list 1,2,3,4,5,6,7
etc
I would like to show all points but with custom hAxis labels, like: 0 5 10 15 20
etc
The code is:
<script type="text/javascript">
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Day', 'Visit', 'Applic.'],
['1', 19, 1],
['2', 100, 9],
['3', 103, 18],
['4', 42, 8],
['5', 34, 2],
['6', 63, 9],
['7', 35, 7],
['8', 427, 51],
['9', 314, 38],
['10', 71, 4],
['11', 27, 0],
['12', 25, 0],
['13', 78, 0],
['14', 54, 0],
['15', 60, 0],
['16', 47, 0],
['17', 29, 0],
['18', 16, 0],
['19', 10, 0],
['20', 26, 0],
['21', 200, 0],
['22', 255, 0],
['23', 160, 0],
['24', 30, 0],
['25', 35, 0],
['26', 9, 0],
]);
var options = {
vAxis: {minValue: 0},
hAxis: {
title: 'Days',
},
pointSize: 8,
colors: ['#9EC653', '#475825'],
chartArea: {
left: 40,
top: 40,
width: 600,
height: 250
},
legend: {position: 'top', textStyle: {fontSize: 14}, alignment: 'center'},
backgroundColor: '#f7f6f4',
};
var chart = new google.visualization.AreaChart(document.getElementById('visits'));
chart.draw(data, options);
}
</script>
And the result is:
The horizontal labels represent all points, I need all of them, but showing specific horizontal labels. How can i set specific interval?
Thanks