timeline row label homonymy

[David Shorthouse]

Hi all,

I've been making timelines but have a homonymy issue in my data for the row labels that I'd like to differentiate. I was hoping that I could use object notation to feed unique "v" values & then format them with "f" as a work-around, but that appears not to work.

Example homonymy issue:

[ { c: [ { v: "Smith" } ... ] }, { c: [ { v: "Smith" } ... ] } ]

Attempted work-around:

[ { c: [ { v: "Q1", f: "Smith" } ... ] }, { c: [ { v: "Q2", f: "Smith" } ... ] } ]

What I was hoping would happen here is that the values for "v" would be used as the groupByRowLabel, which I additionally require, whereas the "f" formatter would be used as display for the row labels. That way, identical labels would show on render but I'd have separate rows because the grouping happens on the value, not the format. However, the "Q1" and "Q2" above are used as undesirable row labels and the "f" is ignored entirely. Evidently, 'string'-type row labels cannot be formatted. 

Would it make any difference if my row values were type number like this?

[ { c: [ { v: 1, f: "Smith" } ... ] }, { c: [ { v: 2, f: "Smith" } ... ] } ]

Thanks,

David

[David Shorthouse]

Hmm...I answered my own question.

[ { c: [ { v: 1, f: "Smith" } ... ] }, { c: [ { v: 2, f: "Smith" } ... ] } ]

Results in an error:

Invalid data table format: column #0 must be of type 'string'.

Can anyone offer a suggestion? Is it possible to change the row label after the groupByRowLabel has been invoked such that if I did have "Q1", "Q2", etc. used as row labels, swap them out for other values just prior to rendering?

Thanks,

David

[David Shorthouse]

I tried another solution that swaps the svg text on a 'ready' listener:

          var labels = {};

          var rowInds = dataTable.getSortedRows([{ column: 0 }]);

          for (var i = 0; i < rowInds.length; i++) {

            var v = dataTable.getValue(rowInds[i], 0);

            labels[v] = dataTable.getFormattedValue(rowInds[i], 0);

          }

          google.visualization.events.addListener(chart, 'ready', function() {

            var tags = container.getElementsByTagName('text');

            $.each(tags, function() {

              if (labels.hasOwnProperty(this.textContent)) {

                this.textContent = labels[this.textContent];

              }

            });

          });

However, the arbitrary ellipses added on long timeline labels that have been grieved many, many times break the above entirely and so am no further ahead.

Ho hum,

David