[bokeh] Interactively adding lines to figure

Sarah_Bird1 · January 31, 2016, 7:09pm

Hi,

The easy way of doing this is to you a CustomJS callback to find the
line that you want to display and change it's alpha to, say, 1.0 and
find the lines that you don't want to display and change their alpha to
0 (so they are invisible).

If you have a lot of potential regions it will require a little trickery
to make these nicely accessible in the CustomJS callback.

I would use the same trick I did in GapMinder. Check out the detailed
notes here:
http://nbviewer.jupyter.org/github/bokeh/bokeh-notebooks/blob/master/tutorial/A1%20-%20Building%20gapminder.ipynb#Let's-break-that-down-a-little

In particular the notes around "In [11]"

Some related code - a callback where I change the alpha:

github.com

mit-jp/cge-tools/blob/0ecce13bddd000bd62d0c5cb62c6a1ef3f5d2a17/crem_presentation/site/content/viz/national_air_pollution.py#L35


      
          plot_width = 900
          end_factor = 5
          ap_plot, ap_line_renderers = get_pm25_national_plot(plot_width=plot_width, end_factor=end_factor)
          co2_plot, co2_line_renderers = get_co2_national_plot(plot_width=plot_width, end_factor=end_factor)
          prefixed_line_renderers = {}
          for key in scenarios:
              prefixed_line_renderers['ap_%s' % key] = ap_line_renderers[key]
              prefixed_line_renderers['co2_%s' % key] = co2_line_renderers[key]
          
          line_array = get_js_array(prefixed_line_renderers.keys())
          code = '''
              var lines = %s,
                  value = cb_obj.get('value'),
                  highlight,
                  glyph;
          
              value = value.replace(/(,$)/g, '');
              highlight = value.split(',');
              Bokeh.$.each(lines, function(key, line) {
                  glyph = line.get('glyph');
                  glyph.set('line_alpha', 0.1);

FWIW This seems annoyingly difficult in Bokeh at the moment and there
are open issues to make this kind of thing easy to do.

Sincerely,

Sarah Bird

···

On 1/29/16 1:54 PM, [email protected] wrote:

Hi,

I want to plotting lines corresponding to the input user will give
through InputText

the code snippet, example.py

region = pd.read_csv("region.csv", encoding="utf-8").set_index("plo_region")
TS_LENGTH=360
fig = figure(plot_width=700, plot_height=500,
y_axis_type="log",y_range=(10**-2, 10**3))

# callback template
def callback_template(new, table, ts_length):
    # whatever behavior

def callback_region(attr, old, new):
    callback_template(new, region, TS_LENGTH)

    # what to add line in callback function
    curdoc().clear()
    fig.line(x=[1,2,3], y=[1,2,3], legend="sdfds",color="black")
    curdoc().add_root(hplot(inputs, fig))

textInput_region = TextInput(value="", title="region:")
textInput_region.on_change("value", callback_region)

controls = [textInput_region]
inputs = HBox(VBoxForm(controls), width=300)

# put the button and plot in a layout and add to the document
curdoc().add_root(hplot(inputs, fig))

so if the user gives "Berlin, Hamburg" in TextInput box, it will trigger
the callback function and plotting two lines on the figure. Instead, if
the user gives "Berlin, Hamburg, Hannover", it will plot three lines.

--
You received this message because you are subscribed to the Google
Groups "Bokeh Discussion - Public" group.
To unsubscribe from this group and stop receiving emails from it, send
an email to [email protected]
<mailto:[email protected]>.
To post to this group, send email to [email protected]
<mailto:[email protected]>.
To view this discussion on the web visit
https://groups.google.com/a/continuum.io/d/msgid/bokeh/7aa6f9f7-b87d-43c0-8332-7d102ce6109f%40continuum.io
<https://groups.google.com/a/continuum.io/d/msgid/bokeh/7aa6f9f7-b87d-43c0-8332-7d102ce6109f%40continuum.io?utm_medium=email&utm_source=footer>\.
For more options, visit https://groups.google.com/a/continuum.io/d/optout\.