更新静态页面中的 Plot ColumnDataSource 列引用

Question

我正在创建一个小仪表板，我希望在其中让用户可以选择从Select框中选择将在垂直轴上绘制的内容。本质上，给定 aColumnDataSource和 aSelect框中的值更改，只需更改给定绘图轴引用的列并更新绘图。鉴于许多其他字形属性可以js_linked用于 widgets，我认为这应该是可能的。到目前为止，我见过的唯一实现是在 Bokeh 服务器中使用 Python 回调，但我试图避免使用 Bokeh 服务器。下图说明了这个想法：

from bokeh.models import ColumnDataSource, Select, CustomJS

from bokeh.plotting import figure

from bokeh.layouts import column

from bokeh.io import output_notebook, output_file, show

output_file('foo.html')

source = ColumnDataSource(

    {

    'x': [0, 1, 2, 3],

    'y': [0, 1, 4, 9],

    'z': [0, 2, 3, 1],

    }

)

fig = figure()

line = fig.line(x='x', y='y', source=source)

dropdown = Select(value='y', options=['y','z'])

dropdown.js_link('value', line.glyph, 'y')

layout = column(dropdown, fig)

show(layout)

我还尝试了以下内容，我认为它在功能上是相同的，但我想更明确：

from bokeh.models import ColumnDataSource, Select, CustomJS

from bokeh.plotting import figure

from bokeh.layouts import column

from bokeh.io import output_file, show

output_file('foo.html')

source = ColumnDataSource(

    {

    'x': [0, 1, 2, 3],

    'y': [0, 1, 4, 9],

    'z': [0, 2, 3, 1],

    }

)

fig = figure()

line = fig.line(x='x', y='y', source=source)

dropdown = Select(value='y', options=['y','z'])

dropdown.js_on_change(

    'value',

    CustomJS(

        args={

            'glyph': line.glyph,

            'source': source,

        }, 

        code="""

            var new_vert = cb_obj.value;

            glyph.y = new_vert; 

        """))

layout = column(dropdown, fig)

show(layout)

在这两种情况下，HTML 都会在浏览器中呈现而不会出错，但是一旦Select值发生变化，线图就会消失，而不是绘制所选CDS系列。我尝试在浏览器中检查，但没有返回任何 JS 错误。我是不是遗漏了什么，或者如果没有 Bokeh Server，这是不可能的？

编辑：

我还应该补充一点，我试图避免CDS在 a 中创建第二个并复制数据CustomJS，因为我有多个子图共享一个CDS，并且我不想为每个图创建一个新的，以便它们的行为保持联系.

Answer 1

的值y实际上是一个对象，用于指定该值是否应该是单个固定值，即来自 CDS 的值序列。python API 在很大程度上隐藏了所有这些。长话短说，您将需要使用第二个版本，并将分配更改为glyph.y = {field: new_vert};