Friday, April 12, 2013

Display Formatted Value along X and Y Axis of Chart

var view = new google.visualization.DataView(data);

var baseDate = /*date to start from, in ms from the Unix Epoch (Jan 1, 1970 00:00:00:000 GMT)*/;
view.setColumns([{
    type: 'date',
    label: 'Date',
    calc: function (dt, row) {
        // get ms from minutes
        var ms = dt.getValue(row, 0) * 60000;
        return new Date(baseDate + ms);
    }
}, 1]);

to get it in string format use this:

var view = new google.visualization.DataView(data);
    
// assumes the DataTable contains the formatted date value
view.setColumns([{
    type: 'string',
    label: 'Date',
    calc: function (dt, row) {
        return dt.getFormattedValue(row, 0);
    }
}, 1]);

Then you draw the chart using the view instead of the dataTable:

chart.draw(view, {/*options*/});






var data = new google.visualization.DataTable();
data.addColumn('string', 'Date');
data.addColumn('number', 'Weight');
data.addRows([
    ['Jan 1, 2000', {v: 100, f: '100 Pounds'}],
    ['Jan 1, 2005', {v: 140, f: '140 Pounds'}],
    ['Jan 1, 2010', {v: 160, f: '160 Pounds'}]
]);

or this:

var data = new google.visualization.DataTable();
data.addColumn('date', 'Date');
data.addColumn('number', 'Weight');
data.addRows([
    // javascript dates use a zero-based index for months, so January is 0 not 1
    // date format is "new Date(year, month, day [, hour [, minute [, second [, microsecond]]]])" (hours, minutes, seconds, microseconds optional)
    // so 1:15:35 PM Jan 1, 2000 is: new Date(2000, 0, 1, 13, 15, 35)
    [new Date(2000, 0, 1), {v: 100, f: '100 pounds'}],
    [new Date(2005, 0, 1), {v: 140, f: '140 pounds'}],
    [new Date(2010, 0, 1), {v: 160, f: '160 pounds'}]
]);

No comments:

Post a Comment