[英]How to change the color of a glyph using callback?
我已經嘗試過使用 Bokeh,現在我想搜索一個單詞並更改其字形的顏色。 我的代碼看起來像這樣:
import bokeh.plotting as bp
from bokeh.models import HoverTool, CustomJS
from bokeh.models.widgets import TextInput
from bokeh.io import vform
words = ["werner", "herbert", "klaus"]
x=[1,2,3]
y=[1,2,3]
color = ['green', 'blue', 'red']
word_input= TextInput(value="word", title="Point out a word")
source = bp.ColumnDataSource(data= dict(x=x,y=y,words=words, color='color'))
hover= HoverTool(tooltips=[("word", "@words")])
# output to static HTML file (with CDN resources)
bp.output_file("plot.html", mode="cdn")
# create a new plot with the tools above, and explicit ranges
p = bp.figure(plot_height = 600, plot_width = 800, title="word2vec", tools=[hover], logo =None)
# add a circle renderer with vectorized colors and sizes
p.circle('x','y', radius= 0.1, color = color, source=source, line_color=None)
callback= CustomJS(args=dict(source=source), code ="""
var data = source.get('data');
var glyph = cb_obj.get('value')
words = data['words']
colors=data['color']
for (i=0; i< words.length;i++){
if(glyph==words[i]){colors[i]='yellow'}
}
source.trigger('change');
""")
layout = vform(word_input, p)
# show the results
bp.show(layout)
這段代碼行不通,我不知道為什么不行。
我做錯了什么? 那天早些時候我發布了另一個問題,這是解決它的第一步。
你有幾個問題:
您創建了CallbackJS
但從未設置為TextInput
的回調屬性
您將數據字典的color
鍵設置為字符串"color"
而不是顏色列表
您將實際的顏色列表作為color
參數傳遞給figure
(它應該是您要使用的數據源列的字符串名稱,例如"color"
)
這是一個有效的版本:
from bokeh.io import vform
from bokeh.models import HoverTool, CustomJS
from bokeh.models.widgets import TextInput
from bokeh.plotting import output_file, figure, show, ColumnDataSource
output_file("plot.html")
words = ["werner", "herbert", "klaus"]
x, y = [1,2,3], [1,2,3]
color = ['green', 'blue', 'red']
source = ColumnDataSource(data=dict(x=x, y=y, words=words, color=color))
hover = HoverTool(tooltips=[("word", "@words")])
p = figure(plot_height=600, plot_width=800, title="word2vec", tools=[hover])
p.circle('x','y', radius=0.1, fill_color='color', source=source, line_color=None)
callback = CustomJS(args=dict(source=source), code="""
var data = source.get('data')
var value = cb_obj.get('value')
var words = data['words']
for (i=0; i < words.length; i++) {
if ( words[i]==value ) { data.color[i]='yellow' }
}
source.trigger('change')
""")
word_input = TextInput(value="word", title="Point out a word", callback=callback)
layout = vform(word_input, p)
show(layout)
更新@bigreddot 的解決方案,以便在其他人遇到類似任務時在 Bokeh 2.2.3 下工作。
from bokeh.layouts import column
from bokeh.models import HoverTool, CustomJS
from bokeh.models.widgets import TextInput
from bokeh.plotting import output_file, figure, show, ColumnDataSource
output_file("plot.html")
words = ["werner", "herbert", "klaus"]
x, y = [1,2,3], [1,2,3]
color = ['green', 'blue', 'red']
source = ColumnDataSource(data=dict(x=x, y=y, words=words, color=color))
hover = HoverTool(tooltips=[("word", "@words")])
p = figure(plot_height=600, plot_width=800, title="word2vec", tools=[hover])
p.circle('x','y', radius=0.1, fill_color='color', source=source, line_color=None)
callback = CustomJS(args=dict(source=source), code="""
var data = source.data;
var value = cb_obj.value;
var words = data['words'];
for (var i=0; i < words.length; i++) {
if ( words[i]==value ) { data.color[i]='yellow' }
}
source.change.emit();
""")
word_input = TextInput(value="word", title="Point out a word")
word_input.js_on_change('value', callback)
layout = column(word_input, p)
show(layout)
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.