Hi,
I'm sorry that there isn't a right solution for this. The correct thing to
do would be to force the chart to interpret the column as discrete, but
there isn't a way to do this today. The best that you can do is to use a
view like you said. Here is how I did it:
function drawVisualization() {
// Create and populate the data table.
var data = new google.visualization.DataTable({
"rows": [
{"c":[{"f":"2012-10-11","v":"Date(2012,9,11)"},{"v":40},{"v": 31}]}],
"cols":[
{"type":"date","id":"date","label":"Date"},
{"type":"number","id":"Forum misc, new posts","label":"Forum misc,
new posts"},
{"type":"number","id":"Forum misc, answered within 48h","label":"Forum
misc, answered within 48h"}]});
var view = new google.visualization.DataView(data);
view.setColumns([{calc:function(dataTable, rowNum) {
return dataTable.getFormattedValue(rowNum, 0).toString();
}, type:'string', label:'Height in Inches'}, 1, 2]);
// Create and draw the visualization.
new google.visualization.ColumnChart(document.getElementById(
'visualization')).
draw(view,
{title:"Yearly Coffee Consumption by Country",
width:600, height:400,
hAxis: {title: "Year"}}
);
}
On Thursday, October 11, 2012 7:11:39 PM UTC-4, Martin Omander wrote:
>
> My app handles datasets in which the first column is a date, followed
> by a variable number of number columns. The app uses these datasets to
> draw Annotated Timelines and ColumnCharts. It recently started showing
> crazy X axis labels. Here is a typical, small data set:
>
> google.visualization.Query.setResponse({"status":"ok","table":{"rows":
> [{"c":[{"f":"2012-10-11","v":"Date(2012,9,11)"},{"v":40},{"v":
> 31}]}],"cols":[{"type":"date","id":"date","label":"Date"},
> {"type":"number","id":"Forum misc, new posts","label":"Forum misc, new
> posts"},{"type":"number","id":"Forum misc, answered within
> 48h","label":"Forum misc, answered within
> 48h"}]},"reqId":"11","version":"0.6"});
>
> When rendered as a ColumnChart, this data used to result in a blue and
> a red bar for "2012-10-12", but recently it has started acting up. The
> blue and red bars are still there, but shifted to the left, and the X
> axis now goes from the year "2000" to "2050".
>
> At the web page
> https://developers.google.com/chart/interactive/docs/customizing_axes#Help
> there are two proposed remedies:
>
> 1. Change the type of your first data table column to string.
> If I did this, the back-end code would have to know if the front-end
> intends to draw the graph as an Annotated Timeline (a date column is
> required) or a ColumnChart (a date column messes up the X axis). This
> seems backwards and it would require a rewrite of my back-end, so I'd
> like to avoid it.
>
> 2. Use a DataView as adapter to convert the type of your first data
> table column to string.
> When I tried this, the red bar disappeared and only the blue bar was
> displayed.
>
>
> Is there another way to fix this display issue, so I get back the blue
> and a red bar for "2012-10-12" with proper labeling for the dataset
> above?
>
>
> Best Regards,
>
> Martin
>
--
You received this message because you are subscribed to the Google Groups
"Google Chart API" group.
To view this discussion on the web visit
https://groups.google.com/d/msg/google-chart-api/-/8s-C6itA4cgJ.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/google-chart-api?hl=en.
