Python Bokeh-单击时显示相应的文本

我想在任何用户单击第一个绘图上的圆圈时显示简单文本（在第二个绘图上）。 我开始在bokeh网站上展示第一个绘图的工作示例

我在下面做了一些更改，这样当用户单击第一个绘图上的圆圈时，第二个绘图应该显示相应的文本。 因此，当用户单击第一个绘图上的圆圈（x=1，y=2）时，第二个绘图上显示的文本应为（'first'）

使用下面的代码，我根本看不到任何绘图，也没有错误！我确定如何调试这个问题

我也对不同的方法持开放态度

---

代码中有一些错误会阻止打印显示。调整以下参数将至少显示两个图。然而，第二个情节将只是你想要的文本叠加在彼此之上。为了获得您想要的功能，我想您需要使用回调：

  # changed text parameter from cpname to name, thats the column you use
  # FFFFF was white, you wouldn't see this, changed to black
    country = Text(x=5, y=50, text='name', text_color="#000000")
    plot.add_glyph(source, country)

如果我有时间，我将在稍后研究回调部分。但这至少会让你从正确的方向开始

/e:这是一个有效的例子。正如前面所怀疑的，添加回调会添加您希望的功能。棘手的部分是JavaScript代码。我希望评论足以理解它：

from bokeh.io import output_file, show, output_notebook, reset_output
from bokeh.plotting import figure
from bokeh.models import ColumnDataSource, Plot, Range1d, Text, TapTool, CustomJS
from bokeh.layouts import column

reset_output()

source = ColumnDataSource(data=dict(x = [1, 10, 16], y = [2, 20, 10],
                                    name_labels = ['first', 'second', 'third'],
                                    name_display = ['','','']
                                    ))

plot = figure(plot_width=400, plot_height=400, tools="tap", title="Select a circle")
renderer = plot.circle(x= 'x', y= 'y', size=50,
                       # set visual properties for selected glyphs
                       selection_color="firebrick",    
                       # set visual properties for non-selected glyphs
                       nonselection_fill_alpha=0.2, nonselection_fill_color="blue",
                       nonselection_line_color="firebrick", nonselection_line_alpha=1.0,
                       source = source)

def construct_text_box(source): 
    # Plot and axes                                                             
    xdr = Range1d(0, 220)                                                       
    ydr = Range1d(0, 120)                                                       

    plot = Plot(                                                                
        x_range=xdr, y_range=ydr,                                                        
        plot_height=120, min_border=0,                                                           
    )                                                                           
    # Add the writing                                                           
    country = Text(x=5, y=50, text='name_display', text_color="#000000")
    plot.add_glyph(source, country)    
    return plot

output_notebook()

JS_CODE ="""
    // Get index of current selected datapoint
    sel_point_index = cb_data.source.attributes.selected["1d"]["indices"][0];     

    /* replace all name_display values with the name_label
       value of currently selected point */
    for (i=0; i < cb_data.source.data.name_labels.length; i++) {
        cb_data.source.data.name_display[i] = cb_data.source.data.name_labels[sel_point_index];
        }       
    cb_data.source.change.emit();
    """

newtaptool = plot.select(type=TapTool)
newtaptool.callback = CustomJS(code=JS_CODE)

text_box = construct_text_box(source)
show(column(plot, text_box))

从bokeh.io导入输出文件，显示，输出笔记本，重置输出
从bokeh.plotting导入图形
从bokeh.models导入ColumnDataSource、Plot、Range1d、Text、TapTool、CustomJS
从bokeh.layouts导入列
重置_输出（）
source=ColumnDataSource（数据=dict（x=[1,10,16]，y=[2,20,10]，
名称标签=[“第一”、“第二”、“第三”]，
名称显示=[“”，，“”]
))
绘图=图形（绘图宽度=400，绘图高度=400，工具=“点击”，标题=“选择圆”）
渲染器=plot.circle（x='x'，y='y'，大小=50，
#设置选定图示符的视觉特性
选择\u color=“firebrick”，
#设置非选定图示符的视觉特性
非选择填充alpha=0.2，非选择填充color=“蓝色”，
非选择线颜色=“耐火砖”，非选择线α=1.0，
来源=来源）
def构造文本框（源）：
#图和轴
xdr=Range1d（0220）
ydr=范围1D（0，120）
绘图=绘图（
x_范围=xdr，y_范围=ydr，
绘图高度=120，最小边界=0，
)                                                                           
#添加文字
国家=文本（x=5，y=50，Text='name_display'，Text_color=“#000000”）
plot.add_字形（来源、国家）
返回图
输出_笔记本（）
JS_代码=”“”
//获取当前选定数据点的索引
sel_point_index=cb_data.source.attributes.selected[“1d”][“index”][0]；
/*用名称标签替换所有名称显示值
当前选定点的值*/
对于（i=0；i

欢迎使用堆栈溢出！你能更具体地回答你的问题吗？在哪种情况下，您的代码不能正常工作？非常好地捕捉到cpname错误。这会同时显示两个绘图…您是否也调整了

添加_glyph

？是的，我错过了该步骤。现在它确实显示了。。。谢谢你的跟进

from bokeh.io import output_file, show, output_notebook, reset_output
from bokeh.plotting import figure
from bokeh.models import ColumnDataSource, Plot, Range1d, Text, TapTool, CustomJS
from bokeh.layouts import column

reset_output()

source = ColumnDataSource(data=dict(x = [1, 10, 16], y = [2, 20, 10],
                                    name_labels = ['first', 'second', 'third'],
                                    name_display = ['','','']
                                    ))

plot = figure(plot_width=400, plot_height=400, tools="tap", title="Select a circle")
renderer = plot.circle(x= 'x', y= 'y', size=50,
                       # set visual properties for selected glyphs
                       selection_color="firebrick",    
                       # set visual properties for non-selected glyphs
                       nonselection_fill_alpha=0.2, nonselection_fill_color="blue",
                       nonselection_line_color="firebrick", nonselection_line_alpha=1.0,
                       source = source)

def construct_text_box(source): 
    # Plot and axes                                                             
    xdr = Range1d(0, 220)                                                       
    ydr = Range1d(0, 120)                                                       

    plot = Plot(                                                                
        x_range=xdr, y_range=ydr,                                                        
        plot_height=120, min_border=0,                                                           
    )                                                                           
    # Add the writing                                                           
    country = Text(x=5, y=50, text='name_display', text_color="#000000")
    plot.add_glyph(source, country)    
    return plot

output_notebook()

JS_CODE ="""
    // Get index of current selected datapoint
    sel_point_index = cb_data.source.attributes.selected["1d"]["indices"][0];     

    /* replace all name_display values with the name_label
       value of currently selected point */
    for (i=0; i < cb_data.source.data.name_labels.length; i++) {
        cb_data.source.data.name_display[i] = cb_data.source.data.name_labels[sel_point_index];
        }       
    cb_data.source.change.emit();
    """

newtaptool = plot.select(type=TapTool)
newtaptool.callback = CustomJS(code=JS_CODE)

text_box = construct_text_box(source)
show(column(plot, text_box))