Okay, I've been searching on this for a while and can't find any kind of
answer that makes any progress so hopefully someone here can point out what
I'm doing wrong.
I have a table chart and a timeline chart, both constructed through
ChartWrappers. The table is in a dashboard object because I'm trying out
the filtering controls; for the moment, the timeline isn't -- while they
share the same data, the timeline needs it preprocessed and sorted
differently, and I didn't want to bork the table. (I'm not familiar enough
with DataViews and other possibilities to know if I can have everything
handled in a view object, but at the moment it looks like that might be
more along the lines of optimization than a fix for this. If I'm wrong,
let me know.) Anyways...
The gist of the page I'm working on is to let the user select an entry from
either the table or the timeline and display the details of that entry in
another div. Handling the actual selection and displaying the info is easy
enough, but what I *want* to do is highlight the selected record in both
charts at the same time, to more obviously show which is which. I thought
the following snippet would work (roughly this; same principles):
// in table-selection event handler
var selected = table.getChart().getSelection()[0];
var rowIdx = selected.row;
var entryId = // get the id value of the entry specified with rowIdx
var timelineEntryIdx = // get the index of the value in the timeline
datatable
// that has the same id as entry id.
var timelineSelection = {
row: timelineEntryIdx,
column: null
};
timeline.getChart().setSelection([timelineSelection]);
I have a select event handler tied to the timeline object as well; it will
fire (sometimes, at least; sometimes nothing happens, and there's no rhyme
or reason to whether it does or not) with the above code, but nothing gets
highlighted. When I use console.log to see what the selection is, I get:
[0] = {
column: null,
row: undefined
}
(And the column: null part isn't dependent on what I have above either;
I've tried setting arbitrary numbers, both within and outside the range of
columns, and it still comes back as null.)
If I select an element on the timeline via the mouse, it works fine -- the
event triggers every time and the selection object is properly defined.
I know that the timeline setSelection method does *something* at least;
I've had code set to clear the selection (i.e. setSelection([])) inside the
table selection handler, and if I select something in the timeline with the
mouse and then select something on the table, it clears the selection no
problem.
Any thoughts? Let me know if you need more info -- I've tried to make this
as complete as possible without just c/p'ing my entire JS file, but I have
no problems with putting in more info.
--Matt
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/d/optout.
