Reputation: 467
I want to show the end of month and not the begin of month. example: March 2014 ==> feb, 28, 2014 example2: Apr 2014 ==> Mar, 31, 2014
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Date', 'Data'],
//January
[new Date(2014, 1 ,1),0.7],
[new Date(2014, 1 ,2),0.5],
[new Date(2014, 1 ,3),0.7],
[new Date(2014, 1 ,4),0.5],
[new Date(2014, 1 ,5),0.7],
[new Date(2014, 1 ,6),0.5],
[new Date(2014, 1 ,7),0.7],
[new Date(2014, 1 ,8),0.5],
[new Date(2014, 1 ,9),0.7],
[new Date(2014, 1 ,10),0.5],
[new Date(2014, 1 ,11),0.7],
[new Date(2014, 1 ,12),0.5],
[new Date(2014, 1 ,13),0.7],
[new Date(2014, 1 ,14),0.5],
[new Date(2014, 1 ,15),0.7],
[new Date(2014, 1 ,16),0.5],
[new Date(2014, 1 ,17),0.7],
[new Date(2014, 1 ,18),0.5],
[new Date(2014, 1 ,19),0.7],
[new Date(2014, 1 ,20),0.5],
[new Date(2014, 1 ,21),0.7],
[new Date(2014, 1 ,22),0.5],
[new Date(2014, 1 ,23),0.7],
[new Date(2014, 1 ,24),0.5],
[new Date(2014, 1 ,25),0.7],
[new Date(2014, 1 ,26),0.5],
[new Date(2014, 1 ,27),0.7],
[new Date(2014, 1 ,28),0.5],
[new Date(2014, 1 ,29),0.7],
[new Date(2014, 1 ,30),0.5],
[new Date(2014, 1 ,31),0.5],
// Feb
[new Date(2014, 2 ,1),0.7],
[new Date(2014, 2 ,2),0.5],
[new Date(2014, 2 ,3),0.7],
[new Date(2014, 2 ,4),0.5],
[new Date(2014, 2 ,5),0.7],
[new Date(2014, 2 ,6),0.5],
[new Date(2014, 2 ,7),0.7],
[new Date(2014, 2 ,8),0.5],
[new Date(2014, 2 ,9),0.7],
[new Date(2014, 2 ,10),0.5],
[new Date(2014, 2 ,11),0.7],
[new Date(2014, 2 ,12),0.5],
[new Date(2014, 2 ,13),0.7],
[new Date(2014, 2 ,14),0.5],
[new Date(2014, 2 ,15),0.7],
[new Date(2014, 2 ,16),0.5],
[new Date(2014, 2 ,17),0.7],
[new Date(2014, 2 ,18),0.5],
[new Date(2014, 2 ,19),0.7],
[new Date(2014, 2 ,20),0.5],
[new Date(2014, 2 ,21),0.7],
[new Date(2014, 2 ,22),0.5],
[new Date(2014, 2 ,23),0.7],
[new Date(2014, 2 ,24),0.5],
[new Date(2014, 2 ,25),0.7],
[new Date(2014, 2 ,26),0.5],
[new Date(2014, 2 ,27),0.7],
[new Date(2014, 2 ,28),0.5],
//March
[new Date(2014, 3 ,1),0.7],
[new Date(2014, 3 ,2),0.5],
[new Date(2014, 3 ,3),0.7],
[new Date(2014, 3 ,4),0.5],
[new Date(2014, 3 ,5),0.7],
[new Date(2014, 3 ,6),0.5],
[new Date(2014, 3 ,7),0.7],
[new Date(2014, 3 ,8),0.5],
[new Date(2014, 3 ,9),0.7],
[new Date(2014, 3 ,10),0.5],
[new Date(2014, 3 ,11),0.7],
[new Date(2014, 3 ,12),0.5],
[new Date(2014, 3 ,13),0.7],
[new Date(2014, 3 ,14),0.5],
[new Date(2014, 3 ,15),0.7],
[new Date(2014, 3 ,16),0.5],
[new Date(2014, 3 ,17),0.7],
[new Date(2014, 3 ,18),0.5],
[new Date(2014, 3 ,19),0.7],
[new Date(2014, 3 ,20),0.5],
[new Date(2014, 3 ,21),0.7],
[new Date(2014, 3 ,22),0.5],
[new Date(2014, 3 ,23),0.7],
[new Date(2014, 3 ,24),0.5],
[new Date(2014, 3 ,25),0.7],
[new Date(2014, 3 ,26),0.5],
[new Date(2014, 3 ,27),0.7],
[new Date(2014, 3 ,28),0.5],
[new Date(2014, 3 ,29),0.7],
[new Date(2014, 3 ,30),0.5],
[new Date(2014, 3 ,31),0.5],
]);
var options = {
title: '',
colors:['#193763','#004411'],
lineWidth: 4 ,
width:'900',
height:'320',
aggregationTarget: 'Date',
};
var chart = new google.visualization.LineChart(document.getElementById('chart'));
chart.draw(data, options);
}
Upvotes: 0
Views: 158
Reputation: 26340
You can specify which values to use for the x-axis labels by setting the hAxis.ticks
option. As an example:
hAxis: {
// set the tick values to "Dec 31, 2013", "Jan 31, 2014", and "Feb 28, 2014"
ticks: [new Date(2013, 11, 31), new Date(2014, 0, 31), new Date(2014, 1, 28)]
}
You still need to fix the months in your data, as I pointed out in my comment on your question.
Upvotes: 1