Thank you for sharing these two options :)
Out of curiosity, which one would you choose in this case, and are there
any particular reasons behind making either choice?
Perhaps if you needed it to be in 'date' format for some other purpose as
well?
On Wednesday, September 25, 2013 5:31:03 PM UTC-7, asgallant wrote:
>
> You can use the "view" parameter of the ChartWrapper to change the way the
> data is displayed. You can either change the string format, or you can
> transform them into Date objects.
>
> Assuming those dates are in the form "yyyymmdd", here are a couple of
> examples you could use:
>
> // reformat the string:
> var VDPViewsWrapper = new google.visualization.ChartWrapper({
> // Example Country Share Query
> containerId: "pageviews",
> dataTable: data,
> chartType: "ColumnChart",
> options: {
> title: 'Pageviews',
> showRowNumber: 'false',
> width: '425',
> height: '300',
> legend: 'none',
> hAxis: {textPosition:'none'},
> titleTextStyle: {fontSize: 18, bold: 'false'}
> },
> view: {
> columns: [{
> type: 'string',
> label: data.getColumnLabel(0),
> calc: function (dt, row) {
> var dateString = dt.getValue(row, 0);
> var year = dateString.substring(0, 4);
> var month = dateString.substring(4, 6);
> var day = dateString.substring(6);
> var date = year + '/' + month + '/' + day;
> return date;
> }
> }, 1]
> }
> });
>
> // change string to a Date object:
> var VDPViewsWrapper = new google.visualization.ChartWrapper({
> // Example Country Share Query
> containerId: "pageviews",
> dataTable: data,
> chartType: "ColumnChart",
> options: {
> title: 'Pageviews',
> showRowNumber: 'false',
> width: '425',
> height: '300',
> legend: 'none',
> hAxis: {textPosition:'none'},
> titleTextStyle: {fontSize: 18, bold: 'false'}
> },
> view: {
> columns: [{
> type: 'date',
> label: data.getColumnLabel(0),
> calc: function (dt, row) {
> var dateString = dt.getValue(row, 0);
> var year = parseInt(dateString.substring(0, 4));
> var month = parseInt(dateString.substring(4, 6)) - 1;
> var day = parseInt(dateString.substring(6));
> var date = new Date(year, month, day);
> return date;
> }
> }, 1]
> }
> });
>
>
> On Wednesday, September 25, 2013 4:37:44 PM UTC-4, WhoSoLovesUs wrote:
>>
>> Hi, I'm getting date values that look like '20130903' from the data table
>> (powered by SuperProxy), so when I hover over my columns I see these
>> unfamiliar and unattractive date values.
>>
>> Can I change the format of the date in my page code?
>>
>> Here is my code:
>>
>> <html>
>>> <head>
>>> <title>GA Chart - Column</title>
>>>
>>> <!--Load the AJAX API-->
>>> <script type="text/javascript"
>>> src='https://www.google.com/jsapi?autoload={
>>> "modules":[{"name":"visualization","version":"1"}]}'>
>>> </script>
>>>
>>> <!-- Visualization -->
>>> <!--
>>> https://developers.google.com/chart/interactive/docs/reference#google.visualization.drawchart-->
>>> <script type="text/javascript">
>>> google.setOnLoadCallback(drawVisualization);
>>>
>>> function drawVisualization () {
>>> var query = new google.visualization.Query('
>>> https://my.appspot.com/url');
>>> // use the #setQuery method if you want to write a select
>>> statement
>>> query.send(function (response) {
>>> var data = response.getDataTable();
>>>
>>> // change column labels
>>> data.setColumnLabel(0, 'Date');
>>> data.setColumnLabel(1, 'Pageviews')
>>>
>>> var VDPViewsWrapper = new google.visualization.ChartWrapper({
>>> // Example Country Share Query
>>> containerId: "pageviews",
>>> dataTable: data,
>>> chartType: "ColumnChart",
>>> options: {
>>> title: 'Pageviews',
>>> showRowNumber: 'false',
>>> width: '425',
>>> height: '300',
>>> legend: 'none',
>>> hAxis: {textPosition:'none'},
>>> titleTextStyle: {fontSize: 18, bold: 'false'}
>>> }
>>> });
>>>
>>> VDPViewsWrapper.draw();
>>> });
>>>
>>> }
>>> </script>
>>> </head>
>>> <body>
>>> <div id="pageviews" style="margin:auto;width:630px;"></div>
>>> </body>
>>> </html>
>>>
>>
>> Thank You
>>
>>
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/groups/opt_out.
