setColumnLabel(columnIndex, label) does not work for me

[sebinio]

Hi all,

I can set the value of the gauge fine but I can not set the column
label from 'today' to 'tomorrow', help! Thanks Sebinio

var gaugeData;
var chart;
var options;

function getMyForm()
{
gaugeData = new google.visualization.DataTable();
gaugeData.addColumn('number', 'today');
gaugeData.addRows(1);
gaugeData.setCell(0, 0, 0);

options = {min:0, max:150, width: 175, height: 175, redFrom: 0,
redTo: 60,
yellowFrom:60, yellowTo: 90, greenFrom:90, greenTo:100,
minorTicks: 5,backgroundColor: '#999999'};

chart = new
google.visualization.Gauge(document.getElementById('menuMyFormChartDiv'));
chart.draw(gaugeData, options);
}

function updateChart()
{
gaugeData.setValue(0, 0, gaugeData.getValue(0, 0) + 25);
alert(gaugeData.getColumnLabel(0)); //returns 1 col
gaugeData.setColumnLabel(0,'tomorrow');
chart.draw(gaugeData, options);
}

[asgallant]

It looks like your code functions just fine.  Normally, the column label does not get displayed as part of the gauge charts.  If you repeat the alert(gaugeData.getColumnLabel(0)); statement, you will see that the column label has changed from 'today' to 'tomorrow'.  What do you expect to happen?

[sebinio]

I was hoping it would change the label on the gauge.

[asgallant]

That's what I suspected >;o)

The DataTable for gauges needs two columns: 1 string and 1 number.  The first column contains the label for the gauge and the second contains the value (see http://code.google.com/apis/ajax/playground/?type=visualization#gauge).  Try this instead:

var gaugeData;
var chart;
var options;

function getMyForm() {
    gaugeData = new google.visualization.DataTable();

    gaugeData.addColumn('string', 'day');
    gaugeData.addColumn('number', 'value');
    gaugeData.addRows(1);
    gaugeData.setCell(0, 0, 'Today');
    gaugeData.setCell(0, 1, 0);

    options = {
        min:0,
        max:150,
        width: 175,
        height: 175,
        redFrom: 0, 
        redTo: 60, 
        yellowFrom:60,
        yellowTo: 90,
        greenFrom:90,
        greenTo:100,
        minorTicks: 5,

        backgroundColor: '#999999'

    };

    chart = new google.visualization.Gauge(document.getElementById('menuMyFormChartDiv'));
    chart.draw(gaugeData, options);
}

function updateChart() {

    gaugeData.setValue(0, 0, 'Tomorrow');
    gaugeData.setValue(0, 1, gaugeData.getValue(0, 1) + 25);
    chart.draw(gaugeData, options);
}

There seems to be a bug (or undocumented feature?) where the label isn't updated when the gauge is redrawn.  I suspect this is because calling draw() on a gauge after it has been drawn once invokes an animation rather than a straight up redraw.  Maybe this would work better:

var gaugeData = new google.visualization.DataTable();    
gaugeData.addColumn('string', 'day');
gaugeData.addColumn('number', 'value');
gaugeData.addRows(1);

function getMyForm(label, value) {
    gaugeData.setCell(0, 0, label);
    gaugeData.setCell(0, 1, value);

    var options = {

        min:0,
        max:150,
        width: 175,
        height: 175,
        redFrom: 0, 
        redTo: 60, 
        yellowFrom:60,
        yellowTo: 90,
        greenFrom:90,
        greenTo:100,
        minorTicks: 5,
        backgroundColor: '#999999'
    };

    var chart = new google.visualization.Gauge(document.getElementById('menuMyFormChartDiv'));
    chart.draw(gaugeData, options);
}

function updateChart() {
    getMyForm('Tomorrow', gaugeData.getValue(0,1) + 25);
}

You'll need to pass the 'label' and 'value' parameters to it the first time you call the function. The downside is that you lose the animation with this method.

[sebinio]

Thanks for your help mate. The later is what I'm doing to get around
it, I was just hoping for more eloquent solution but I kind of
understand why it doesn't but it would be nice if it could, like you
can with value.

[Jinji]

Thanks for reporting this issue.

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.

To post to this group, send email to google-visua...@googlegroups.com.
To unsubscribe from this group, send email to google-visualizati...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.