Как использовать индекс выбранных данных с одной фигуры, чтобы построить что-то на другой фигуре?

Question

У меня есть точечная диаграмма на одной фигуре. Я хотел бы иметь возможность выбрать, возможно, несколько точек данных на упомянутом графике рассеяния, и построить (возможно) многострочную диаграмму временных рядов на другом рисунке, основываясь на индексах выбранных данных.

Псевдокод:

data = { x: [1,2,3], y: [1,2,3], time_series: [[1,2,3],[4,5,6],[7,8,9]] }
figure1 = scatter_plot(x, y, select_enabled=True)
figure2 = multi_line_timeseries(figure1.indexes_of_selected_points)
show([figure1, figure2])

Так что если [1,1] точка данных (индекс 0) выбирается на рисунке 1, затем [1,2,3] временные ряды (индекс 0) нанесены на рис. 2. Если выбрано несколько точек, то несколько временных рядов построены.

Сдержанность в том, что библиотеку HoloViews нельзя использовать, поскольку она не поддерживает мою платформу.

Как этого достичь?

Answer 1

Примечание. Я решил не поддерживать одновременное построение нескольких временных рядов, хотя это будет тривиальным расширением.

Чтобы использовать индекс выбранной точки данных для определения того, что должно быть нанесено на другой рисунок, вам необходимо:

• поставить соответствующие данные (т.е. x,y,timeseries в примере) на одном или нескольких ColumnDataSources;
  • Я поместил данные для выбора и данные, которые будут обновлены на разных компакт-дисках, потому что боюсь, что это может создать цикл обратного вызова, хотя я не проверял это.
• создать ColumnDataSource который будет служить источником для второй фигуры, которая строит временные ряды;
• включить инструмент выбора, например TapTool ('tap');
• добавить CustomJS обратный звонок в ColumnDataSource который содержит выбираемые точки данных;
• параметризовать этот обратный вызов с ColumnDataSource который содержит данные временных рядов;
• иметь индексы доступа обратного вызова выбранных точек данных;
• сделать обратный вызов внести необходимые изменения во вторую фигуру ColumnDataSource;
• вызов cds_of_2nd_figure.change.emit() перед возвращением из обратного вызова.

Код для иллюстрации:

cds = ColumnDataSource(data=dict(x=x,y=y,timeseries=timeseries))
cds2 = ColumnDataSource(x_to_plot=[],u_to_plot=[])

def selection_callback(d=cds,d2=cds2):
    last_selected_ix = cb_obj.selected.indices[0]
    timeserie = d.data['timeseries'][last_selected_ix]
    x_to_plot = timeserie['x']
    y_to_plot = timeserie['y']
    d2.data['x_to_plot'] = x_to_plot
    d2.data['y_to_plot'] = y_to_plot
    d2.changes.emit()

# turn above function to js
selection_callback = CustomJS.from_py_func( selection_callback )

cds.callback = selection_callback

Когда какая-то фигура выбирает данные из cds, timeseries[ix] временная серия будет нанесена на рисунок / ы, что сюжет cds2, где ix индекс последней выбранной точки данных из cds,

Соответствующий ресурс, содержащий всю необходимую информацию: https://bokeh.pydata.org/en/latest/docs/user_guide/interaction/callbacks.html