javascript - Bokeh div 小部件，通过按下按钮更改文本

Question

我想要一个 Bokeh 按钮来更改 div 小部件中的文本。

我发现了类似的东西:

https://groups.google.com/a/continuum.io/forum/#!topic/bokeh/

我试着让它适合我的情况，因为链接中显示的示例旨在更改按钮本身的文本:

from bokeh.models import CustomJS
from bokeh.layouts import row, column
from bokeh.models.widgets import Div, Button

op="FirstText"

Output= Div(text="""<font size="4">""" + op + """</font>""", width=200, height=20)


ChangeTextScript = """
    o1="NewText";
    //location.reload();
"""

ResponseButton = Button(label="ChangeText",callback=CustomJS(args={'o1':op},code=ChangeTextScript))

layout=(
    column(
        ResponseButton,
        Output
    )
)

output_file("ChangeText.html", title="NewText")

show(layout)

按钮和“FirstText”正在显示，但单击按钮不会更改文本。我已经发现java脚本是通过在java脚本中添加当前注释行来触发的(当我点击按钮时页面被刷新)。

我还认为我可以使用用于刷新图表的“ColumnDataSource”，但 Div 不支持“source=...”。

Answer 1

您需要将 Div 小部件本身作为参数传递给回调并更新其文本属性:

ChangeTextScript = """
    o1.text="<font size='4'>"+"NewText"+"</font>";
"""
ResponseButton = Button(label="ChangeText",callback=CustomJS(args={'o1':Output},code=ChangeTextScript))