Bokeh 以交互方式更改正在绘制的列

Question

我有一个大数据集想要探索。但是我不想创建多个图。我只想要一个图，我可以在其中交互地更改用于 x 和 y 轴的列，并且图会自行更新。

我正在尝试使用 Python/Bokeh 来执行此操作，使用 Bokeh 将我的脚本提供给浏览器。但是我不清楚如何更新情节。我看到很多更改底层数据源的示例，但我不想这样做，我只想更改正在绘制的列。

我在下面做了一个简单的例子来说明我想要做的事情。它使用两个“选择”小部件来选择数据源的 x 和 y 列。这些回调尝试更改“Line”字形所引用的列。然而这似乎不起作用。任何的建议都受欢迎。

import numpy as np

from bokeh.models import ColumnDataSource
from bokeh.plotting import Figure

from bokeh.models.widgets import Select,TextInput
from bokeh.models.glyphs import Line
from bokeh.models.layouts import HBox, VBox
from bokeh.io import curdoc


#==============================================================================
#%% Define some Data
#==============================================================================
N = 200

# Define the data to be used
x = np.linspace(0,4.*np.pi,N)
y = 3*np.cos(2*np.pi*x + np.pi*0.2)
z = 0.5*np.sin(2*np.pi*0.8*x + np.pi*0.4)

source = ColumnDataSource({'x':x,'cos':y,'sin':z})


#==============================================================================
#%% Layout
#==============================================================================


TOOLS = "box_select,lasso_select,help"

# create a new plot 
plot = Figure(tools=TOOLS,  title=None)

# Make a line and connect to data source
glyph = Line(x="x", y="cos", line_color="#F46D43", line_width=6, line_alpha=0.6)
plot.add_glyph(source, glyph)

# Add list boxes for selecting which columns to plot on the x and y axis
yaxis_select = Select(title="Y axis:", value="cos",
                           options=['x','cos','sin'])


xaxis_select = Select(title="X axis:", value="x",
                           options=['x','cos','sin'])


# Text input as a title
text = TextInput(title="title", value='my sine wave plotter')

# Layout widgets next to the plot                     
controls = VBox(text,yaxis_select,xaxis_select)

layout = HBox(controls,plot,width=800)


#==============================================================================
#%% Callbacks
#==============================================================================
# Put callbacks on the list boxes so that when they are changed the columns being
# plotted get changed.

def update_x_axis(attr, old, new):
    # Change the column used for the x axis
    glyph.x = xaxis_select.value


def update_y_axis(attr, old, new):
    # Change the column used for the y axis
    glyph.y = yaxis_select.value



yaxis_select.on_change('value', update_y_axis)
xaxis_select.on_change('value', update_x_axis)



#==============================================================================
#%% Add to document root
#==============================================================================

curdoc().add_root(layout)
curdoc().title = "Plotting app"

Answer 1

要编辑字形从中获取坐标的实际源字段，您需要在此问题中找到的代码的变体。ImportanceOfBeingErnest 代码的修订版可以产生正确的结果，无需更改原始 ColumnDataSource 或隐藏 Select 小部件中的任何键：

import numpy as np

from bokeh.models import ColumnDataSource
from bokeh.plotting import Figure

from bokeh.models.widgets import Select, TextInput
from bokeh.models.layouts import HBox, VBox
import bokeh.io
from bokeh.io import curdoc
from bokeh.models import CustomJS

N = 200

# Define the data to be used
x = np.linspace(0, 4. * np.pi, N)
y = 3 * np.cos(2 * np.pi * x + np.pi * 0.2)
z = 0.5 * np.sin(2 * np.pi * 0.8 * x + np.pi * 0.4)

data = {'x': x, 'cos': y, 'sin': z}
source = ColumnDataSource(data=data)

codex = """
            var column = cb_obj.value;
            line1.glyph.x.field = column;
            source.trigger('change')
        """
codey = """
            var column = cb_obj.value;
            line1.glyph.y.field = column;
            source.trigger('change')
        """

# create a new plot
plot = Figure(title=None)

# Make a line and connect to data source
line1 = plot.line(x="x", y="cos", line_color="#F46D43", line_width=6, line_alpha=0.6, source=source)

callbackx = CustomJS(args=dict(line1=line1, source=source), code=codex)
callbacky = CustomJS(args=dict(line1=line1, source=source), code=codey)

# Add list boxes for selecting which columns to plot on the x and y axis
yaxis_select = Select(title="Y axis:", value="cos",
                      options=data.keys(),
                      callback=callbacky
                      )

xaxis_select = Select(title="X axis:", value="x",
                      options=data.keys(),
                      callback=callbackx
                      )

# Text input as a title
text = TextInput(title="title", value='my sine wave plotter')

# Layout widgets next to the plot
controls = VBox(text, yaxis_select, xaxis_select)

layout = HBox(controls, plot, width=800)

# bokeh.io.show(layout)
curdoc().add_root(layout)
curdoc().title = "Sliders"

为了清楚起见，我将代码字符串分开，但 ImportanceOfBeingErnest 的 string.format() 使用非常简洁。

不幸的是，我无法获得用于编辑这些特定字段的完整 Python 解决方案，尽管 ImportanceOfBeingErnest 的解决方案实际上根本不需要 JavaScript（但确实更改了数据源）