
I have 4 figures with 4 different data sources that contains different data except for a common alt_id column.
My goal is to have the user’s selection of a single point on one figure, result in the selection of all the datapoints sharing the same alt_id on all figures.
This does work, but not immediately. When the page is first displayed, the selection of a datapoint on one figure causes seemingly random selections on the other three. The selection on the initial figure is fine.
This problem continues unless and until datapoints are selected on each of the figures in turn. From then on the callback works as intended.
Is there some reindexing that occurs when a selection is made?
Here is the callback code as it stands right now.
cb_click = CustomJS(args=dict(s1=s1, s2=s2, s3=s3, s4=s4), code="""
var sources = [s1, s2, s3, s4];
var new_sel = [s1.selected, s2.selected, s3.selected, s4.selected];
var new_idx = [[], [], [], []];
// get the index of the circle that is being selected
var j = cb_obj.selected['1d'].indices[0];
// identify the target, all data relating to this will be selected
var tg = cb_obj.data['alt_id'][j];
// loop over the sources and 'select' all the items that match the targets alt_id
for(var k = 0; k < sources.length; k++) {
// create an array idx that contains the indices of the points you want to select
for(var i = 0; i < sources[k].data['alt_id'].length; i++) {
if (sources[k].data['alt_id'][i] == tg) {
new_idx[k].push(i);
}
}
// append the new selected array to the source
new_sel[k]['1d'].indices = new_idx[k];
sources[k].selected = new_sel[k];
sources[k].trigger('change');
}
“”")
``
