Click on a glyth and open a new glyph on a new browser tab

Community Support
1

Hi, everybody,
I already had a post in this forum that really helps me a lot for my project. I have a new concern.
I have plotted squares on a figure and I would like to be able to click on each figure and open a new tab, where new figures will be displayed. I’m going to put two codes here and I would like to find my way through this for my project.
I would like that by clicking on one of the 4 glyphs we get the vbar figure of the code below on a new tab.
I really hope that what I want is possible on bokeh.
Thank you for your help.

#the first code
import os
from bokeh.models import ColumnDataSource, Patches, CustomJS
from bokeh.plotting import figure
from bokeh.layouts import row
from bokeh.io import output_file, curdoc
import pandas as pd
from bokeh.plotting import figure, show
from bokeh.sampledata.iris import flowers
x = [[1,2,4], [3,5,6], [7,9,7], [5,7,6]]
y = [[4,2,1], [6,5,8], [3,9,6], [2,2,1]]
group = ['A', 'A', 'B', 'B']
id = [0,1,2,3]
df = pd.DataFrame(data=dict(x=x, y=y, group=group, id=id))
source = ColumnDataSource(df)
p = figure(tools="tap")
renderer = p.patches('x', 'y', source=source)
def my_tap_handler(attr,old,new):
    return
source.on_change("selected", my_tap_handler)
show (p)

#the second code

from bokeh.io import output_file, show
from bokeh.models import ColumnDataSource
from bokeh.palettes import Spectral6
from bokeh.plotting import figure
output_file("bar_colors.html")
fruits = ['Apples', 'Pears', 'Nectarines', 'Plums', 'Grapes', 'Strawberries']
counts = [5, 3, 4, 2, 4, 6]
source = ColumnDataSource(data=dict(fruits=fruits, counts=counts, color=Spectral6))
p = figure(x_range=fruits, y_range=(0,9), plot_height=350, title="Fruit Counts",
           toolbar_location=None, tools="")
p.vbar(x='fruits', top='counts', width=0.9, color='color', legend_field="fruits", source=source)
p.xgrid.grid_line_color = None
p.legend.orientation = "horizontal"
p.legend.location = "top_center"
show (p)
2

@konos1992 Real Python callbacks, i.e. with on_change only function in Bokeh server applications. That is because, in order to execute Python callback code, there has to be a running Python process. The Bokeh server is that Python process that executes on_change callback code. More simply:

No Bokeh server means No on_change callbacks.

What you have above with show is referred to as “standalone output”, i.e. the Python code runs, generates some HTML+JS and sends it to the browser, and then the Python process exits the picture. The only option in this case is JavaScript callbacks that can execute in the browser. So you have two options at a high level:

  • Use and run/deploy a Bokeh server, so that Python on_change callbacks can function.

  • Keep generating standalone output with show but only use JavaScript callbacks with js_on_change and CustomJS.

That said, Bokeh is really geared towards use cases that update content on an existing page. e.g. adding new plots to a layout of plots, or updating an existig plot. I won’t say it is impossible to open up a new document in a new tab, but it’s never really come up and certainly no work has been done to cater to that use-case or make it simple. The problems are basically:

  • You can’t (AFAIK) open a new tab from a Python callback, and
  • A JS callback could open a new page on a new tab, but It’s going to be tricky to represent an entirely new, separate Bokeh document for a new tab within an existing Bokeh document/page.

So unfortunately I don’t think what you describe is straightforward to accomplish. Perhaps some others will have some more concrete ideas, though.

3

thank you for your help and I look forward to further contributions.

4

I guess I should also ask the question: Can you generate all the vbar HTML files up front and host them at some URL accessible to the first page? If so, then a tap tool JS callback could easily call window.open on the URLs for the other vbar pages you want to have open up.

5

Yes I had to think about it. But I don’t know anything about html and jS.
I still have to do a lot of research for that.
I should already be thinking of an alternative.