如何以交互方式显示和隐藏散景图中的线条？ [英] How to interactively display and hide lines in a Bokeh plot?

问题描述

能够以交互方式显示和隐藏散景图中的线条会很棒。说，我创建了这样的情节：

It would be nice to be able to interactively display and hide lines in a bokeh plot. Say, I have created my plot something like this:

from bokeh.plotting import output_file, figure, show
from numpy.random import normal, uniform

meas_data_1 = normal(0, 1, 100)
meas_data_2 = uniform(-0.5, 0.5, 100)

output_file("myplot.html", title="My plot")
fig = figure(width=500, plot_height=500)

fig.line(x=range(0, len(meas_data_1)), y=meas_data_1)
fig.line(x=range(0, len(meas_data_2)), y=meas_data_2)

show(fig)

如何添加交互式启用/禁用两条线之一的可能性？

How can I add the possibility to interactively enable/disable one of the two lines?

我知道这是在愿望清单上（参见此功能请求） ，但这听起来不会太快实施。

I know that this is on the wish list (see this feature request), but that doesn't sound like it would be implemented too soon.

我认为应该可以使用 CheckBoxGroup 和自定义回调，但不幸的是这个回调必须用JavaScript编写，我绝对没有经验。

I have the impression that this should be possible using a CheckBoxGroup and a self-defined callback, but unfortunately this callback has to be written in JavaScript, which I have absolutely no experience in.

推荐答案

编辑：现在，从Bokeh 0.12.5 开始，交互式图例已内置到库中，请参阅 https://bokeh.github.io/blog / 2017/4/5 / release-0-12-5 /

EDIT: Interactive legends are now built into the library as of Bokeh 0.12.5, see https://bokeh.github.io/blog/2017/4/5/release-0-12-5/

这似乎在轨道上在某些时候作为互动传说实施：
https://github.com/bokeh /背景虚化/ I ssues / 3715

This appears on track to be implemented at some point as interactive legends: https://github.com/bokeh/bokeh/issues/3715

目前（v0.12.1），有一个示例在复选框上使用CustomJS来实现此目的：
https://github.com/bokeh/bokeh/pull/4868

Currently (v0.12.1), there is an example that uses CustomJS on checkboxes to achieve this: https://github.com/bokeh/bokeh/pull/4868

相关代码：

import numpy as np

from bokeh.io import output_file, show
from bokeh.layouts import row
from bokeh.palettes import Viridis3
from bokeh.plotting import figure
from bokeh.models import CheckboxGroup, CustomJS

output_file("line_on_off.html", title="line_on_off.py example")

p = figure()
props = dict(line_width=4, line_alpha=0.7)
x = np.linspace(0, 4 * np.pi, 100)
l0 = p.line(x, np.sin(x), color=Viridis3[0], legend="Line 0", **props)
l1 = p.line(x, 4 * np.cos(x), color=Viridis3[1], legend="Line 1", **props)
l2 = p.line(x, np.tan(x), color=Viridis3[2], legend="Line 2", **props)

checkbox = CheckboxGroup(labels=["Line 0", "Line 1", "Line 2"],
                         active=[0, 1, 2], width=100)
checkbox.callback = CustomJS(args=dict(l0=l0, l1=l1, l2=l2, checkbox=checkbox),
                             lang="coffeescript", code="""
l0.visible = 0 in checkbox.active;
l1.visible = 1 in checkbox.active;
l2.visible = 2 in checkbox.active;
""")

layout = row(checkbox, p)
show(layout)

这篇关于如何以交互方式显示和隐藏散景图中的线条？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！