Click on a glyth and open a new glyph on a new 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

Hi @konos1992 please edit your post to use code formatting so that the code is intelligible (either with the </> icon on the editing toolbar, or triple backtick ``` fences around the code blocks)

3

Hi @konos1992 you have plain text quoted the code above, not applied code formatting. With the role indentation plays in Python code, it’s really important that you edit to use actual code formatting (that will preserve code indentation), so that it is comprehensible, or so that it can be directly copied and executed to test with. I described the Discourse mechanisms for applying code formatting in the reply above. Otherwise all I can do is say that what you describe sounds do-able, at least from the narrative description.

1 Like
4

I was informed that I could no longer change my topic. So I was forced to make a new topic in a different section. “Community Support”
thanks

5

@konos1992 Discourse has some odd arbitrary default rules for new users, I can’t say I know all of them. As it happens, Community Support is actually the correct place for this anyway. The Development category is intended for questions/discussion around development of Bokeh itself, rather than usage questions such as this.