I have a simple pandas.DataFrame:
df = pd.DataFrame(
{
"name": ['foo','bar'],
"kpi1": [1,2],
"kpi2": [2,1]
}
)
Which I want to scatter plot using Bokeh. First step is:
import bokeh.plotting as bpl
import bokeh.models as bmo
bpl.output_notebook()
p = bpl.figure(tools=["hover"])
p.scatter(
'kpi1',
'kpi2', source=source)
bpl.show(p) # open a browser
Next, I want to configure the tooltip. In particular I want to see the index of each point and the associated name. Here's the second step:
source = bpl.ColumnDataSource.from_df(df)
hover = bmo.HoverTool(
tooltips=[
("index", "$index"),
('Name', '$name')
]
)
p = bpl.figure(tools=[hover])
p.scatter(
'kpi1',
'kpi2', source=source)
bpl.show(p) # open a browser
This works partially. The tooltip contains two fields (index and Name) but the latter is filled with ???. How can I make it read the right column from the dataframe and use it for the tooltip's field?
That is because you call the tooltips with $ instead of #.
The correct definition would be
hover = bmo.HoverTool(
tooltips=[
("index", "#index"),
('Name', '#name')
]
)
By the way, you don't need to to import bokeh.plotting and bokeh.models as a variable. You can sinmply do:
from bokeh.plotting import figure, ColumnDataSource
from bokeh.io import output_file, show
from bokeh.models import HoverTool
and then
# Create a ColumnDataSource from df: source
source = ColumnDataSource(df)
# Create the figure: p
p = figure(tools=["hover"])
# Add circle glyphs to the figure p
p.circle('kpi1', 'kpi2', source= source)
show(p)
hover = HoverTool(tooltips=[("index", "#index"),
('Name', '#name')])
p.add_tools(hover)
show(p)
Related
I cannot find a way how to place a series name in a tooltip instead of ???. Here is a simple code that I tried and the output:
from bokeh.plotting import figure, output_file, show
from bokeh.models import HoverTool
x_data = [[2,4,6,8], [2,4,6,8]]
y_data = [[2,5,9,6], [5,7,6,2]]
names = ['y1', 'y2']
output_file('index.html')
p = figure(plot_width=300, plot_height=200)
p.multi_line(x_data, y_data)
p.add_tools(HoverTool(tooltips=[
('Name', '#names')
]))
show(p)
I tried several formats of names list (or list of lists), but no success.
Do you have any idea?
Based on the scatter plot example in the documentation (here), it looks like the way to go is to create a dictionnary with all the keys and values that you need for your plot and hover tool. And create a ColumnDataSource based on this dictionary. See code below:
from bokeh.plotting import figure, output_file, show, ColumnDataSource
from bokeh.models import HoverTool
source=ColumnDataSource({'x_data':[[2,4,6,8], [2,4,6,8]],'y_data':[[2,5,9,6], [5,7,6,2]],'names':['y1', 'y2']})
output_file('index.html')
p = figure(plot_width=300, plot_height=200)
p.multi_line('x_data', 'y_data',source=source)
p.add_tools(HoverTool(tooltips=[('Name', '#names')]))
show(p)
And the result shows the correct tooltips:
My code for the bokeh HoverTool is the following:
p = figure(
plot_height=250,
x_axis_type='datetime',
)
p.vbar(x=data_df['date'].dt.to_pydatetime(), top=data_df['data'].values, width=datetime.timedelta(1))
hover_tool = HoverTool(
tooltips=[('Count', '#top'), ('Date', '#x')], mode='vline', formatters={'$x': 'datetime'}
)
p.add_tools(hover_tool)
I still get the numeric format of the date as can be seen on the image. I tried formatters={'#x': 'datetime'} with no luck.
Your solution works, if you use $x instead of #x and add one of the listed formats supported by the DatetimeTickFormatter to ('Date', '$x') like ('Date', '$x{%F}'). There are plenty of options and you can select the one you prefere the most.
Minimal Example
import pandas as pd
from bokeh.plotting import show, figure, output_notebook
from bokeh.models import HoverTool, ColumnDataSource
output_notebook()
data_df = pd.DataFrame({'date':pd.date_range('2022-05-13', freq='D', periods=10), 'top':list(range(10))})
p = figure(
plot_height=250,
x_axis_type='datetime',
)
p.vbar(x=data_df['date'], top=data_df['top'], width=pd.Timedelta('12H'))
hover_tool = HoverTool(
tooltips=[('Count', '#top'), ('Date', '$x{%F}')], mode='vline', formatters={"$x": "datetime"}
)
p.add_tools(hover_tool)
show(p)
Comment:
I don't know why there is no working default, but maybe because there are so many options, that any default would be somehow wrong.
I'm using the Bokeh package to plot a line chart.
I want a given line to bolden (alpha to increase) when I hover over it.
I added a hover tool and then added "hover_line_alpha = 0.6" in my line chart.
However when I hover over points on a given line, the line disappears altogether!
Can you help me fix this?
Code below so you can see my logic.
Thanks,
Ross
# Code in Question
from bokeh.io import output_notebook, show, output_file
from bokeh.plotting import figure
from bokeh.models import ColumnDataSource, HoverTool
output_notebook()
# set out axes
x = 'time_rnd'
y = 'count'
# set colour palette
col_brew = ['#8dd3c7','#ffffb3','#bebada','#fb8072','#80b1d3','#fdb462','#b3de69','#fccde5','#d9d9d9','#bc80bd','#ccebc5','#ffed6f']
# map out figure
plot = figure(tools='box_select, lasso_select, save' ,x_axis_type='datetime')
# add HoverTool
hover_info = [('time', '#hover_time'),
('word', '#word'),
('count', '#count')]
hover = HoverTool(names=['use'],tooltips=hover_info,
mode='mouse',
show_arrow=True
)
plot.add_tools(hover)
### FOR LOOP OF PLOT [THIS IS WHERE THE ISSUE MANIFESTS]
for i in top_wds_test:
df_eng_word = df_eng_timeline[df_eng_timeline['word']==i]
source = ColumnDataSource(df_eng_word)
plot.line(x, y, line_width = 3,
line_alpha = 0.1, line_color=col_brew[top_wds.index(i)],
hover_line_alpha = 0.6,
#hover_line_color = 'black',
#hover_line_color = col_brew[top_wds.index(i)],
source = source, legend=i, name = 'use'
)
plot.circle(x, y, fill_color='white', size=5,
selection_color='green',
nonselection_fill_color='grey',nonselection_fill_alpha=0.4,
hover_color='red',
source = source, name = 'use')
# add legend
plot.legend.location = "top_left"
plot.legend.label_text_font_style = 'bold'
# materialize the plot
show(plot)
There seems to be an issue when the renderers share a data source. However, this works (with Bokeh >= 0.13.0) if you let Bokeh create a new separate source for each glyph:
from bokeh.models import ColumnDataSource
from bokeh.plotting import figure, show
p = figure(tools="hover", tooltips="$name: #$name")
data=dict(x=[1,2,3], y1=[2,6,5], y2=[6,2,3])
p.line('x', 'y1', color="navy", line_width=3, source=data,
alpha=0.1, hover_color="navy", hover_alpha=0.6, name="y1")
p.line('x', 'y2',color="firebrick", line_width=3, source=data,
alpha=0.1, hover_color="firebrick", hover_alpha=0.6, name="y2")
show(p)
I have more than one line on a bokeh plot, and I want the HoverTool to show the value for each line, but using the method from a previous stackoverflow answer isn't working:
https://stackoverflow.com/a/27549243/3087409
Here's the relevant code snippet from that answer:
fig = bp.figure(tools="reset,hover")
s1 = fig.scatter(x=x,y=y1,color='#0000ff',size=10,legend='sine')
s1.select(dict(type=HoverTool)).tooltips = {"x":"$x", "y":"$y"}
s2 = fig.scatter(x=x,y=y2,color='#ff0000',size=10,legend='cosine')
fig.select(dict(type=HoverTool)).tooltips = {"x":"$x", "y":"$y"}
And here's my code:
from bokeh.models import HoverTool
from bokeh.plotting import figure
source = ColumnDataSource(data=dict(
x = [list of datetimes]
wind = [some list]
coal = [some other list]
)
)
hover = HoverTool(mode = "vline")
plot = figure(tools=[hover], toolbar_location=None,
x_axis_type='datetime')
plot.line('x', 'wind')
plot.select(dict(type=HoverTool)).tooltips = {"y":"#wind"}
plot.line('x', 'coal')
plot.select(dict(type=HoverTool)).tooltips = {"y":"#coal"}
As far as I can tell, it's equivalent to the code in the answer I linked to, but when I hover over the figure, both hover tools boxes show the same value, that of the wind.
You need to add renderers for each plot. Check this. Also do not use samey label for both values change the names.
from bokeh.models import HoverTool
from bokeh.plotting import figure
source = ColumnDataSource(data=df)
plot = figure(x_axis_type='datetime',plot_width=800, plot_height=300)
plot1 =plot.line(x='x',y= 'wind',source=source,color='blue')
plot.add_tools(HoverTool(renderers=[plot1], tooltips=[('wind',"#wind")],mode='vline'))
plot2 = plot.line(x='x',y= 'coal',source=source,color='red')
plot.add_tools(HoverTool(renderers=[plot2], tooltips=[("coal","#coal")],mode='vline'))
show(plot)
The output look like this.
I'm new to bokeh and I just jumped right into using hovertool as that's why I wanted to use bokeh in the first place.
Now I'm plotting genes and what I want to achieve is multiple lines with the same y-coordinate and when you hover over a line you get the name and position of this gene.
I have tried to mimic this example, but for some reason the I can't even get it to show coordinates.
I'm sure that if someone who actually knows their way around bokeh looks at this code, the mistake will be apparent and I'd be very thankful if they showed it to me.
from bokeh.plotting import figure, HBox, output_file, show, VBox, ColumnDataSource
from bokeh.models import Range1d, HoverTool
from collections import OrderedDict
import random
ys = [10 for x in range(len(levelsdf2[(name, 'Start')]))]
xscale = zip(levelsdf2[('Log', 'Start')], levelsdf2[('Log', 'Stop')])
yscale = zip(ys,ys)
TOOLS="pan,wheel_zoom,box_zoom,reset,hover"
output_file("scatter.html")
hover_tips = levelsdf2.index.values
colors = ["#%06x" % random.randint(0,0xFFFFFF) for c in range(len(xscale))]
source = ColumnDataSource(
data=dict(
x=xscale,
y=yscale,
gene=hover_tips,
colors=colors,
)
)
p1 = figure(plot_width=1750, plot_height=950,y_range=[0, 15],tools=TOOLS)
p1.multi_line(xscale[1:10],yscale[1:10], alpha=1, source=source,line_width=10, line_color=colors[1:10])
hover = p1.select(dict(type=HoverTool))
hover.tooltips = [
("index", "$index"),
("(x,y)", "($x, $y)"),
]
show(p1)
the levelsdf2 is a pandas.DataFrame, if it matters.
I figured it out on my own. It turns out that version 0.8.2 of Bokeh doesn't allow hovertool for lines so I did the same thing using quads.
from bokeh.plotting import figure, HBox, output_file, show, VBox, ColumnDataSource
from bokeh.models import Range1d, HoverTool
from collections import OrderedDict
import random
xscale = zip(levelsdf2[('series1', 'Start')], levelsdf2[('series1', 'Stop')])
xscale2 = zip(levelsdf2[('series2', 'Start')], levelsdf2[('series2', 'Stop')])
yscale2 = zip([9.2 for x in range(len(levelsdf2[(name, 'Start')]))],[9.2 for x in range(len(levelsdf2[(name, 'Start')]))])
TOOLS="pan,wheel_zoom,box_zoom,reset,hover"
output_file("linesandquads.html")
hover_tips = levelsdf2.index.values
colors = ["#%06x" % random.randint(0,0xFFFFFF) for c in range(len(xscale))]
proc1 = 'Log'
proc2 = 'MazF2h'
expression1 = levelsdf2[(proc1, 'Level')]
expression2 = levelsdf2[(proc2, 'Level')]
source = ColumnDataSource(
data=dict(
start=[min(xscale[x]) for x in range(len(xscale))],
stop=[max(xscale[x]) for x in range(len(xscale))],
start2=[min(xscale2[x]) for x in range(len(xscale2))],
stop2=[max(xscale2[x]) for x in range(len(xscale2))],
gene=hover_tips,
colors=colors,
expression1=expression1,
expression2=expression2,
)
)
p1 = figure(plot_width=900, plot_height=500,y_range=[8,10.5],tools=TOOLS)
p1.quad(left="start", right="stop", top=[9.211 for x in range(len(xscale))],
bottom = [9.209 for x in range(len(xscale))], source=source, color="colors")
p1.multi_line(xscale2,yscale2, source=source, color="colors", line_width=20)
hover = p1.select(dict(type=HoverTool))
hover.tooltips = OrderedDict([
(proc1+" (start,stop, expression)", "(#start| #stop| #expression1)"),
("Gene","#gene"),
])
show(p1)
Works like a charm.
EDIT: Added a picture of the result, as requested and edited code to match the screenshot posted.
It's not the best solution as it turns out it's not all that easy to plot several series of quads on one plot. It's probably possible but as it didn't matter much in my use case I didn't investigate too vigorously.
As all genes are represented on all series at the same place I just added tooltips for all series to the quads and plotted the other series as multi_line plots on the same figure.
This means that if you hovered on the top line at 9.21 you'd get tooltips for the line at 9.2 as well, but If you hovered on the 9.2 line you wouldn't get a tooltip at all.