散景从CustomJS获取值(更改数据源中的值) [英] Bokeh get values from CustomJS (change values in data source)

问题描述

我修改了此示例. 我最终想要的是一种获取图中选定的数据点并在python代码中对其进行修改的方法.因此，我在这里添加了一个函数，该函数应该从第二张图返回值(这就是按钮的作用).但是，如果我选择了这些点，它们将正确绘制，但是数据源不会更改(单击按钮将提供{'X':[]，'Y':[]}.如何从JS回写到python bokeh数据源吗?应该不是s2.change.emit()或s2.trigger('change')做这个吗?我也尝试了后者，但没有用.

I have modified this example. What I want- eventually- is a way to get the datapoints selected in a graph and modifiy them in the python code. Thus I added a function here that should return the values from the second graph (thats what the button is for). However, if I select the points, they are plotted correctly, but the data source is not changed (the button click provides {'X':[],'Y':[]}. How do I write back from JS to the python bokeh data source? Isn't the s2.change.emit() or a s2.trigger('change') supposed to do this? I also tried the latter but its not working.

from random import random

from bokeh.layouts import row
from bokeh.models import CustomJS, ColumnDataSource
from bokeh.plotting import figure
from bokeh.models.widgets import Button
from bokeh.io import curdoc


x = [random() for x in range(500)]
y = [random() for y in range(500)]

s1 = ColumnDataSource(data=dict(x=x, y=y))
p1 = figure(plot_width=400, plot_height=400, tools="lasso_select", title="Select Here")
p1.circle('x', 'y', source=s1, alpha=0.6)

s2 = ColumnDataSource(data=dict(x=[], y=[]))
p2 = figure(plot_width=400, plot_height=400, x_range=(0, 1), y_range=(0, 1),
            tools="", title="Watch Here")
p2.circle('x', 'y', source=s2, alpha=0.6)

s1.selected.js_on_change('indices', CustomJS(args=dict(s1=s1, s2=s2), code="""
        var inds = cb_obj.indices;
        var d1 = s1.data;
        var d2 = s2.data;
        d2['x'] = []
        d2['y'] = []
        for (var i = 0; i < inds.length; i++) {
            d2['x'].push(d1['x'][inds[i]])
            d2['y'].push(d1['y'][inds[i]])
        }
        s2.change.emit();
    """)
)
def get_values():
    global s2
    print(s2.data)     

button = Button(label="Get selected set")
button.on_click(get_values)


layout = row(p1, p2,button)
curdoc().add_root(layout)
curdoc().title = "my dashboard"

推荐答案

单击该按钮时，此代码将显示第二个绘图中的更新源数据.使用以下命令运行它:bokeh serve --show app.py

This code will display the updated source data from the second plot when the button is clicked. Run it with: bokeh serve --show app.py

from random import random
from bokeh.models import CustomJS, ColumnDataSource, Row
from bokeh.plotting import figure, show, curdoc
from bokeh.models.widgets import Button

x = [random() for x in range(500)]
y = [random() for y in range(500)]

s1 = ColumnDataSource(data = dict(x = x, y = y))
p1 = figure(plot_width = 400, plot_height = 400, tools = "lasso_select", title = "Select Here")
p1.circle('x', 'y', source = s1, alpha = 0.6)

s2 = ColumnDataSource(data = dict(x = [], y = []))
p2 = figure(plot_width = 400, plot_height = 400, x_range = (0, 1), y_range = (0, 1), tools = "", title = "Watch Here")
p2.circle('x', 'y', source = s2, alpha = 0.6)

s1.selected.js_on_change('indices', CustomJS(args = dict(s1 = s1, s2 = s2), code = """
        var inds = cb_obj.indices;
        var d1 = s1.data;
        d2 = {'x': [], 'y': []}
        for (var i = 0; i < inds.length; i++) {
            d2['x'].push(d1['x'][inds[i]])
            d2['y'].push(d1['y'][inds[i]])
        }
        s2.data = d2  """))

def get_values():
    print(s2.data)

button = Button(label = "Get selected set")
button.on_click(get_values)

curdoc().add_root(Row(p1, p2, button))

您的示例中未更新源数据，因为JS中没有检测推送变化的机制.只能检测到将新对象分配给source.data.一旦检测到更改，就可以同步BokehJS和Python模型之间的数据.

The source data is not updated in your example because there is no mechanism in JS to detect the push changes. Only assigning a new object to source.data can be detected. Once the change is detected the data between BokehJS and Python models can be synchronised.

这篇关于散景从CustomJS获取值(更改数据源中的值)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！