Toggle elements of a plot on/off (without server)

Community Support
1

Hi,

I’m trying to produce a plot which shows three datasets (as separate sources, etc) on a single plot. (In this instance, mass spectral data)

I would like the ability to use the checkbox buttons to toggle the display of these on/off.

I assume it’s possible using the customJS widget code, but I can’t make much sense of it.

For example,

…
p3 = figure(tools=TOOLS, title=y[:-9],width=800, height=600, x_axis_label=‘m/z’,y_axis_label=‘Rel Abun’,y_range=[min(data[“RA”]),max(data[“RA”])],x_range=[0,800])

p3.segment(x0=0,x1=800,y0=0,y1=0,line_width=1, line_color=“black”)

p3.segment(x0=‘mz’,y0=0,x1=‘mz’,y1=‘RA’,source=source,line_width=linewidth, line_color=“black”) #pair1

p3.scatter(x=‘mz’, y=‘RA’,source=source,fill_color=‘black’,line_color=None) #pair1

p3.segment(x0=‘mz’,y0=0,x1=‘mz’,y1=‘RA’,source=isosource,line_width=linewidth, line_color=“green”) #pair2

p3.scatter(x=‘mz’, y=‘RA’,source=isosource,fill_color=‘green’,line_color=None) #pair2

p3.segment(x0=‘mz’,y0=0,x1=‘mz’,y1=‘RA’,source=nosource,line_width=linewidth, line_color=“red”) #pair3

p3.scatter(x=‘mz’, y=‘RA’,source=nosource,fill_color=‘red’,line_color=None) #pair3
…

``

I would like to be able to toggle the display of the pairs of segment/scatter plots shown…

Anyone have any ideas how/if this is possible?

2

You do not have to use customJS if you host the plot with bokeh serve.

You can change the line_alpha of the segment when the checkbox is clicked using on_click() for CheckboxButtonGroup.

3

EDIT: Use CheckboxGroup

···

On Wednesday, June 29, 2016 at 8:59:43 AM UTC-5, Hunt Jackson Sparra wrote:

You do not have to use customJS if you host the plot with bokeh serve.

You can change the line_alpha of the segment when the checkbox is clicked using on_click() for CheckboxButtonGroup.

4

First I will mention that the motivating use case for alot of CustomJS development was updating data sources for existing glyphs, etc. It's very good at this and there are many demonstrations of this use-case. Which is not to say that more coarse-grained operations like swapping entire glyphs in and out is not a useful or important use case too, but just that it probably has not gotten as much attention yet. My recommendation for this kind of thing for now would just be set the .visible property of glyphs to True/False to make them visible or not.

Some concrete guidance. The glyph methods like .segment, etc return a GlyphRenderer:

  r = p.segment(...)

This (and any others) can be made available to the CustomJS code by passing it as the args property:

  cb = CustomJS(code=js_code, args=dict(r=r, ...))

Then in your js_code, you can set .visible on the glyph:

  r.glyph.visible = false

To do more sophisicated things like switching, etc, you'll need to pass more of those glyph renderers to your callback, and do whatever bookkeeping is necessary to know which ones to toggle on/off based on the widget state, but hopefully this gets you started.

Bryan

···

On Jun 29, 2016, at 8:04 AM, Will Kew <[email protected]> wrote:

Hi,

I'm trying to produce a plot which shows three datasets (as separate sources, etc) on a single plot. (In this instance, mass spectral data)

I would like the ability to use the checkbox buttons to toggle the display of these on/off.

I assume it's possible using the customJS widget code, but I can't make much sense of it.

For example,
...
    p3 = figure(tools=TOOLS, title=y[:-9],width=800, height=600, x_axis_label='m/z',y_axis_label='Rel Abun',y_range=[min(data["RA"]),max(data["RA"])],x_range=[0,800])
    p3.segment(x0=0,x1=800,y0=0,y1=0,line_width=1, line_color="black")
  
    p3.segment(x0='mz',y0=0,x1='mz',y1='RA',source=source,line_width=linewidth, line_color="black") #pair1
    p3.scatter(x='mz', y='RA',source=source,fill_color='black',line_color=None) #pair1
    
    p3.segment(x0='mz',y0=0,x1='mz',y1='RA',source=isosource,line_width=linewidth, line_color="green") #pair2
    p3.scatter(x='mz', y='RA',source=isosource,fill_color='green',line_color=None) #pair2
     
    p3.segment(x0='mz',y0=0,x1='mz',y1='RA',source=nosource,line_width=linewidth, line_color="red") #pair3
    p3.scatter(x='mz', y='RA',source=nosource,fill_color='red',line_color=None) #pair3
...

I would like to be able to toggle the display of the pairs of segment/scatter plots shown...

Anyone have any ideas how/if this is possible?

--
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].
To post to this group, send email to [email protected].
To view this discussion on the web visit https://groups.google.com/a/continuum.io/d/msgid/bokeh/df7cda8f-7774-40b5-9526-533d6f92014c%40continuum.io\.
For more options, visit https://groups.google.com/a/continuum.io/d/optout\.