Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[BUG] Toolbar above plot with many hovers shifted to the right #13699

Open
Icoti opened this issue Feb 16, 2024 · 0 comments
Open

[BUG] Toolbar above plot with many hovers shifted to the right #13699

Icoti opened this issue Feb 16, 2024 · 0 comments

Comments

@Icoti
Copy link
Contributor

Icoti commented Feb 16, 2024

Software versions

Python version : 3.12.1 | packaged by conda-forge | (main, Dec 23 2023, 07:53:56) [MSC v.1937 64 bit (AMD64)]
IPython version : 8.21.0
Tornado version : 6.3.3
Bokeh version : 3.3.4
BokehJS static path : C:\Users\XXXX\miniconda3\envs\myenv312\Lib\site-packages\bokeh\server\static
node.js version : (not installed)
npm version : (not installed)
jupyter_bokeh version : (not installed)
Operating system : Windows-10-10.0.19045-SP0

Browser name and version

No response

Jupyter notebook / Jupyter Lab version

No response

Expected behavior

I have a plot with many curves.
Since I want to have line specific hover labels, I created one HoverTool per line, using toggleable=False because I don't need them to be toggled and shown in the toolbar.
Because I have a legend right outside of the plot in my real case and I find that the toolbar right of it doesn't look nice (and I don't have so much room), I placed the toolbar on the top.
I would expect following output:
Expectation

Observed behavior

But I observe that the toolbar is shifted to the right, possibly overlapping with other objects:
Error case

Example code

import random
from bokeh.plotting import figure, show
from bokeh.models import ColumnDataSource, HoverTool, Div
from bokeh.layouts import row, Spacer
from bokeh.palettes import Category10

# Define the number of lines:
line_nb = 15

# Prepare some data:
source_dict = {"x": list(range(1, 6))}
for i in range(line_nb):
    source_dict[f"y{i}"] = [random.random() for j in source_dict["x"]]

source = ColumnDataSource(data=source_dict)

# Create a new plot:
p = figure(title="Multiline graph", x_axis_label="x", y_axis_label="y", height=300, toolbar_location="above")
# Workaround: toolbar_sticky=False but takes more vertical space.
# Other toolbar_location "below", "right", "left" behave as expected.

# Add renderers and hovers:
for n in range(line_nb):
    y_name = list(source_dict.keys())[n+1]
    renderer = p.line(source=source,
           x=list(source_dict.keys())[0],
           y=y_name,
           color=Category10[10][n%10],
           )
    
    hover = HoverTool(toggleable=False) # <-- Changing to toggleable=True shows all buttons and explains the current position of the toolbar.
    hover.tooltips = [("(x, "+y_name+")", "(@{x}, @{"+y_name+"})")] # With line specific labels
    hover.renderers = [renderer]
    p.add_tools(hover)

# Setup and show layout:
div = Div(text="Some other graphical element")
layout = row(p, Spacer(width=50), div)
show(layout)

Stack traceback or browser console output

The right end of the toolbar is exactly at the same position as it would be if the toggle buttons were displayed (hover setting toggleable=True):
Toggleable=True
Also with toggleable=True, the automatic hiding of exceeding toggle buttons does not work as it would if I place the toolbar at the bottom of the plot:
Below red

Workaround
My workaround is to use toolbar_sticky=False in the figure definition. This works, but this shifts the toolbar upwards further away from the plot area, so this is not so nice.
In my case, I have several plots in a column, and it then looks like the toolbar of a lower plot actually belongs to the one above.
Workaround

Screenshots

No response

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants