What's it all about, Alfie?

I have been messing with the Google Visualization's AnnotatedTimeLine widget on my webapp, and while it's wonderful in so many ways, there are a few 'gotchas' that I've run into - and I'm not alone on one of these.

Specifying Column Index in Hiding/Showing Columns

The AnnotatedTimeLine has some really nice methods that allow you to show/hide the lines on the graph (columns in the DataTable):

    chart.hideDataColumns(2);
    chart.showDataColumns(2);

the problem is that the columnIndex that you'd think you needed to pass in would probably be wrong. They are looking for the dataset index and for that, you have to remember that the date data in column 0 of the table is really not considered in this calculation.

So, if you have the name of the column and want to make it disappear, you need to have a function like:

    function toggleView(name, state) {
      var i;
      var colCnt = graphData.getNumberOfColumns();
      for (i = 1; i < colCnt; i++) {
        if (graphData.getColumnLabel(i) == name) {
          // the dataset number is one less than the column number
          if (state) {
            chart.showDataColumns(i-1);
          } else {
            chart.hideDataColumns(i-1);
          }
        }
      }
    }

If you remember to have the right offset, it all works fine.

Showing a Hidden Line Bug

I found a reference to this on the Google Visualization mailing list. It turns out that if you try to show a hidden line, it doesn't work. But if you cycle it twice then it works. Meaning this doesn't work:

    // hide the line on the graph
    chart.hideDataColumns(2);
    // show the line we just hid
    chart.showDataColumns(2);

but this does:

    // hide the line on the graph
    chart.hideDataColumns(2);
    // show the line we just hid
    chart.showDataColumns(2);
    chart.hideDataColumns(2);
    chart.showDataColumns(2);

It's the "second cycle" on the 'show' side of things that makes the difference. This is an acknowledged bug by Google, and the good news is that as soon as they fix it, we're going to get the fix. Nice.

UPDATE: With the 3/30/2009 Release Candidate from Google, this is fixed! Yup, just use the version "1.1" in the google.load() javascript call and you'll set it. It's set to go to production on 4/6, and at that point, version "1" will again get it. Excellent update!

So... just keep these in mind if you're using this widget.

This entry was posted on Tuesday, March 31st, 2009 at 8:59 am and is filed under Coding, Open Source Software. You can follow any responses to this entry through the RSS 2.0 feed. Both comments and pings are currently closed.