python bokeh slider_如何在Bokeh中基于RangeSlider选择数据点?

I am trying to build an interactive graph in Bokeh. So far let's say I have a heatmap like below. In plain English:

I am using rect to draw rectangles producing a heatmap.

I am adding a RangeSlider.

I am attaching a js_callback on changes of the range.

In the custom Callback, I am able to retrieve the start and end range of the range slider.

What I am uncertain about is how to then select anything with it. This link (cb_obj.selected['1d'].indices) shows that one retrieve all selected data points. But how does one do the opposite?

In other words:

How do I select all the rectangles that fall between values a and b?

Below is the code with things I figured out already.

from math import pi

from bokeh.io import show

from bokeh.models import ColumnDataSource, HoverTool,

LinearColorMapper, CategoricalColorMapper, ColorBar, LogColorMapper,

LogTicker

from bokeh.plotting import figure

from bokeh.models.callbacks import CustomJS

col = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16]

row = ['A', 'B', 'C' , 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M',

'N', 'O', 'P']

mapper = LogColorMapper(palette="Viridis256", low=min_value,

high=max_value)

source = ColumnDataSource(data = dict (

row = test['plate_row'],

col = test['plate_col'],

values = test['Melt Temp']))

TOOLS = "reset, tap,box_select, hover,save,pan,box_zoom,wheel_zoom"

p = figure(title="Plate Heatmap", x_range = (0.0,25.0), y_range =

list(reversed(row)),

x_axis_location="above", plot_width=650, plot_height=400,

tools=TOOLS)

r1 = p.rect(x="col", y="row", width=1, height=1,

source=source,

fill_color={'field': 'values', 'transform': mapper},

line_color=None)

callback = CustomJS(args=dict(source=source), code="""

var data = source.data;

var inds = cb_obj.selected['1d'].indices;

var lower_bound = cb_obj.start;

var upper_boudn = cb_obj.end;

// WHAT DO I DO NEXT?

source.trigger('change');

""")

range_slider = widgetbox(RangeSlider(start=min_value, end=max_value,

range= (min_value, max_value), step=0.1, title="Hit Threshold"))

range_slider.js_on_change('range', callback)

color_bar = ColorBar(color_mapper=mapper, ticker=LogTicker(),

label_standoff=12, border_line_color=None, location=

(0,0))

p.add_layout(color_bar, 'left')

layout = column(range_slider, p)

show(layout) # show the plot

解决方案

While I was not able to do find a way to set what is selected or not, I found a way to achieve the same outcome. This is perhaps a prime example for how a Bokeh server could be used. To accomplish this same effect, one needs to do the following:

Replace the JSCustom callback function with a Python update

function. The udpate function contains code to update the

ColumnDataSource.

Replace the js_on_change event simply with a on_change event

attached to the slider.

Place the code above together with the update function within

"main.py" within a folder named after the application.

Start the bokeh server with "bokeh serve --show INSERTAPP_NAME".

This information can be found here and represents the simplest way of deploying an interactive visualization. More complicated deployment scenarios may be necessary for your case. I am looking into this as well, but this will be another question for another day.

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值