Axis controls for Date types are currently broken in the API. If they were working, though, you would use hAxis.gridlines.count to set the number of labels. There is a bug report on this
here; you can "star" the issue to get updates on it.
On Thursday, December 6, 2012 11:11:51 AM UTC-5, Mischiew Rithe wrote:
Hello,
I'm trying to use date as a type on hAxis to have a month-based gridline, but it doesn't seem to be possible to display more than 3 months no matter the font / graph size. When displaying numbers instead this problem doesn't exist, so it does look as a bug when displaying dates.
Slanting text, specifying gridline count, showTextEvery, ... don't help.
Here's a short example below.
Can anyone help me out with this?
Thanks
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-us" xml:lang="en-us">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Test</title>
<script src="https://www.google.com/jsapi"></script>
<script>
google.load('visualization', '1.0', {'packages':['corechart']});
</script>
</head>
<body class="change-list">
<div id="chart_div" style="width: 1200px; height: 600px; position: relative;" />
<script type="text/javascript">
google.setOnLoadCallback(drawChart);
function drawChart() {
var dt = new google.visualization.DataTable({
cols:[
{label:'Period', type:'date'},
{label:'a', type:'number'},
{label:'b', type:'number'},
{label:'c', type:'number'},
]
});
dt.addRow([new Date(2012, 0, 1), 0, 1768, 0]);
dt.addRow([new Date(2012, 1, 1), 66, 1987, 0]);
dt.addRow([new Date(2012, 2, 1), 66, 1987, 0]);
dt.addRow([new Date(2012, 3, 1), 66, 2157, 2041]);
dt.addRow([new Date(2012, 4, 1), 66, 2157, 2041]);
dt.addRow([new Date(2012, 5, 1), 66, 2157, 2295]);
dt.addRow([new Date(2012, 6, 1), 66, 3323, 2295]);
dt.addRow([new Date(2012, 7, 1), 66, 3542, 2359]);
dt.addRow([new Date(2012, 8, 1), 516, 3542, 2391]);
dt.addRow([new Date(2012, 9, 1), 516, 3542, 6536]);
dt.addRow([new Date(2012, 10, 1), 516, 3542, 6536]);
dt.addRow([new Date(2012, 11, 1), 516, 3542, 6536]);
var options = {
title: '2012',
isStacked: true,
hAxis: {
title: 'Month',
titleTextStyle: { color:'red' },
textStyle: { fontSize:11 },
format: 'MMM'
},
vAxis: {
viewWindowMode: 'maximized',
textStyle: { fontSize:11 }
},
legend: {
textStyle: { fontSize:11 }
}
};
google.visualization.drawChart({
"containerId": "chart_div",
"dataTable": dt,
"chartType": "AreaChart",
"options": options
});
}
</script>
</body>
</html>