CODEWITHSUNDEEP
chartstooltip
johnode
johnode

Reputation: 740

Change tooltip data in Google Charts

I have column google charts. (using https://www.google.com/jsapi)

Vertical axis for count of bananas(for example) Horizontal axis for dates

so, each my column tooltip looks like:

20.02.2011
Bananas: 3

I need to replace 20.02.2011 on some my text on each column.

Is it possible?

UPD I need to replace 20.02.2011 on some my text on each column. But dates on Horizontal axis should stay as they are.

Upvotes: 1

Views: 2427

Answers (2)

minaz
minaz

Reputation: 5790

The best way to do it without changing your actual data points is via the tooltip option. As an example copy the following code to google's visualization playground.

function drawVisualization() {
    data = new google.visualization.DataTable()
    data.addColumn('string', 'Date');
    data.addColumn('number');
    data.addColumn({type:'string',role:'tooltip'});
    data.addRow();
    base = 10;
    data.setValue(0, 0, 'Datapoint1');
    data.setValue(0, 1, base++);
    data.setValue(0, 2, " This is my tooltip1 ");

    data.addRow();
    data.setValue(1, 0, 'Datapoint2');
    data.setValue(1, 1, base++);
    data.setValue(1, 2, "This is my second tooltip2");

    // Draw the chart.
    var chart = new google.visualization.BarChart(document.getElementById('visualization'));
    chart.draw(data, {legend:'none', width:600, height:400});
}

Upvotes: 3

Prashant Bhate
Prashant Bhate

Reputation: 11087

One option is to change the horizontal axis with the text that you want.

For ex. In this sample code http://code.google.com/apis/ajax/playground/?type=visualization#bar_chart Chart URL

If you want to replace year with your custom text then change 

var years = [2003, 2004, 2005, 2006, 2007, 2008];

to either

var years = ["a", "b", "c", "d", "e", "f"];

or

var years = ["2003:a", "2004:b", "2005:c", "2006:d", "2007:e", "2008:f"];

Upvotes: 0

Related Questions