散景突出显示第二个图中的值并显示数据 table

Question

我有两个地块和一个数据table。我想在图 1 中 select 一个值，然后在图 2 中突出显示图二的相应值。此外，我想在两个图下显示一个数据 table select编辑值。这是我目前所拥有的：

from bokeh.plotting import figure
from bokeh.models import ColumnDataSource
from bokeh.io import show
import numpy as np
import pandas as pd
from bokeh.layouts import row
from bokeh.models.widgets import DataTable, TableColumn


df2 = pd.DataFrame(np.array([[1, 3.280, 3.3925], [2, 3.3012, 3.4303], [3, 3.5972, 3.8696]]),
                   columns=['abspos', 'val1', 'val1_q'])

source = ColumnDataSource(data=df2)

p1 = figure(title="Plot1",
            plot_width=1500,
            plot_height=900,
            x_range=[0, 5],
            y_range=[0, 5])

p1.circle('abspos', 'val1', source=source, line_color=None, color='red', size=6)

pq1 = figure(title="Plot2",plot_width=900, plot_height=900)
pq1.circle('val1_q', 'val1', source=source, line_color=None, size=6)

columns = [
        TableColumn(field="abspos", title="abspos"),
        TableColumn(field="val1", title="val1"),
        TableColumn(field="val1_q", title="val1_q")
    ]
data_table = DataTable(source=source, columns=columns, width=300, height=280)


def plot_both(plot1, plot2):
    show(row(plot1, plot2))
    
    
plot_both(p1, pq1)

如果我 select 图 1 中的数据点 [2, 3.3012]，数据点 [3.3012, 3.4303] 应在图 2 中突出显示。下方的数据 table 应显示 [ 2, 3.3012, 3.4303].

问题 1：如何根据绘图 1 中的 selected 点（反之亦然）在绘图 2 中实现突出显示。

问题2：如何在两个图下显示Table，显示selected数据点的数据。

Answer 1

最简单的方法是使用点击工具（以下代码适用于 Bokeh v2.1.1）

from bokeh.plotting import show, figure
from bokeh.models import ColumnDataSource, Row, Column, CustomJS, DataTable, TableColumn
import numpy as np
import pandas as pd

df2 = pd.DataFrame(np.array([[1, 3.280, 3.3925], [2, 3.3012, 3.4303], [3, 3.5972, 3.8696]]),
                   columns=['abspos', 'val1', 'val1_q'])

source = ColumnDataSource(data=df2)

p1 = figure(title="Plot1",plot_width=900, plot_height=500, tools="tap,pan,box_zoom,wheel_zoom,save,reset")
p1.circle('abspos', 'val1', source=source, line_color=None, color='blue', size=10)

p2 = figure(title="Plot2",plot_width=900, plot_height=500, tools="tap,pan,box_zoom,wheel_zoom,save,reset")
p2.circle('val1_q', 'val1', source=source, line_color=None, color='blue', size=10)

columns = [
        TableColumn(field="abspos", title="abspos"),
        TableColumn(field="val1", title="val1"),
        TableColumn(field="val1_q", title="val1_q")
    ]
dt1 = DataTable(source=source, columns=columns, width=900, height=300)
dt2 = DataTable(source=source, columns=columns, width=900, height=300)

show(Column(Row(p1, p2), Row(dt1, dt2)))

如果您需要更多功能，您需要添加一个 JS 回调，例如 p1.js_on_event('tap', CustomJS(args={...}, code="..."))

散景突出显示第二个图中的值并显示数据 table

Bokeh highlight values in second plot and show data table

python

bokeh