Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Hover tool improvements

See original GitHub issue

background color for div configurable
preserve OrderedDict field order on BokehJS side
configurable with .eco template for more flexible presentation
target user-supplied div id instead of creating tooltip
fixed x, y position, or locations like “upper left”
per-glyph customization
docs/examples configuring for individual glyphs

Issue Analytics

State:
Created 9 years ago
Reactions:3
Comments:19 (12 by maintainers)

Top GitHub Comments

2reactions

etch32commented, Sep 18, 2014

I’d like to ability to specify if the hover should display to the ‘left’, ‘right’, or ‘auto’ (which is the current functionality) of the cursor.

1reaction

brycepgcommented, Dec 16, 2016

@joelostblom

I have an interm solution for you until this feature is added:

Add an identifier to your tooltip div
Use a callback in your hovertool to a javascript snippit
Have the callback manipulate the dom

Make sure you remove position:fixed and top/bottom from your style

from bokeh.models import CustomJS

callback = CustomJS(code="""
// You may want to make this future-proof by making a function that finds the parent element by the class 'bk-tooltip'
var tooltip = document.getElementById("static-tooltip").parentElement.parentElement.parentElement;
tooltip.style.top = ""; // unset what bokeh.js sets
tooltip.style.left = "";
tooltip.style.bottom = "0px";
tooltip.style.left = "0px";

""")
hover2 = HoverTool(tooltips="""
    <div id="static-tooltip">
    <span style="font-size: 16px;">@Shrt_Desc</span>
    <span style="font-size: 14px;"><br>@RDI{1.1} %RDI</span>
    <span style="font-size: 14px;"><br>@Grams{1.1} @Unit</span>
    </div>
""", callback=callback)