如何在bokeh中创建一个加载指示器？

Question

如何在bokeh中创建一个加载指示器？

3

我正在使用Bokeh中的单选按钮。我希望能够在单选按钮被点击时显示一个加载指示器，然后在Python回调完成后显示它已经完成。使用Bokeh如何实现这一点？

我尝试过使用js_onchange和onchange与单选按钮结合使用的组合。但是我无法想出一种方法来通知JS端在Python回调完成时。

callback = CustomJS(args={}, code="""
  document.getElementById('message_display').innerHTML = 'loading...';
""")

radio_button.js_on_change('active', callback)
radio_button.on_change('active', some_other_callback)

当我运行它时，innerHTML被设置为loading并且调用了on_change Python回调函数，图表更新了，但是我无法在JS端触发变化来改变innerHTML以显示done。

- tink3r

阅读您的帖子，我可以将其分成5个问题而不是一个 :) 1) 如何创建“加载指示器？2) 如何知道回调结束执行？3如何在回调之外执行JS代码4) 如何从Python回调中调用JS回调？5) 如何从当前JS回调调用另一个JS回调？您需要哪些答案？ - Tony

这是一个概述。我有一个单选按钮。我点击单选按钮。这会触发一个Python回调函数，使用on_change运行。我正在尝试在之前显示加载指示器，在之后显示完成指示器。我已经能够使用js_on_change显示加载指示器。我的问题在于如何知道Python代码何时完成，并使用JavaScript更新界面。 - tink3r

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Tony · Answer 1

假设用户在视图中已经有一个图表，一种选择是在图表的范围上设置一个回调函数，当图表更新时，它将被触发。

from bokeh.models import CustomJS

p = figure()

def python_callback()
    p.y_range = Range1d(None, None)
    # get your data here and update the plot

code = "document.getElementById('message_display').innerHTML = 'loading finished';"
callback = CustomJS(args = dict(), code = code)
p.y_range.js_on_change('start', callback)

请参见下面的工作示例：

import numpy as np
from bokeh.plotting import figure, show
from bokeh.models import CustomJS, ColumnDataSource

points = np.random.rand(50, 2)
cds = ColumnDataSource(data = dict(x = points[:, 0], y = points[:, 1]))

p = figure(x_range = (0, 1), y_range = (0, 1))
p.scatter(x = 'x', y = 'y', source = cds)

cb_to_make_selection = CustomJS(args = {'cds': cds}, code = """
function getRandomInt(max){return Math.floor(Math.random() * Math.floor(max));}
cds.selected.indices = [getRandomInt(cds.get_length()-1)]
""")

p.x_range.js_on_change('start', cb_to_make_selection)

show(p)