CODEWITHSUNDEEP
htmlpython-3.xgraphpython-imaging-librarybokeh
DS-V
DS-V

Reputation: 123

bokeh - How to get hover tool to only work for specific points?

I have the following code:

bk.reset_output()
bk.output_notebook()
source1 = ColumnDataSource(data=dict(x=xnew, y=y_smooth))
source2 = ColumnDataSource(data=dict(x=xmax, y=ymax, desc=xmax, imgs = ['../Documents/cat.jpeg',
                                                                    '../Documents/lebowski.jpg']))

# create a new plot with a title and axis labels
p = bk.figure(plot_width=500, plot_height=500, title='foobar')
# add a line and a Hover tool that will display the value of x and y at any point along the line
#p.line(x='CCS', y='Intensity', line_width=2, source=source)

    p.add_tools(HoverTool(
    tooltips="""
    <div>
        <span style="font-size: 17px; font-weight: bold;">@desc</span>
    </div>
         <img
                src="@imgs" height="100" alt="@imgs" width="100"
                style="float: left; margin: 0px 15px 15px 0px;"
                border="2"
            ></img>
            """
))

p.scatter(x='x', y='y', source=source2, marker="inverted_triangle", size=12)
p.line(x='x', y='y', source=source1)
p.xaxis.axis_label = 'CCSD'
p.yaxis.axis_label = 'Intensity'
# show the results
show(p)

It gives me this graph:

enter image description here

As you can see I have an overlap. I want there to only be a pop up corresponding to the triangles (it includes the image) instead it gives me one for every point along the line as well as for the triangles hence why I get an over lap with a ??? popup. Essentially I only want the hover tool to work for the p.scatter graph not for both. Is there some possible way to do this?

I'm new to Bokeh and programming in generally, so feeling quite stuck.

Upvotes: 4

Views: 1712

Answers (1)

Pallie
Pallie

Reputation: 1099

Give the glyph that needs the hovertool a name:

p.scatter(x='x', y='y', source=source2, marker="inverted_triangle", size=12, name='needshover')

Make the hovertool and point it to the glyph:

hover = HoverTool(names=['needshover'], tooltips="""
    <div>
        <span style="font-size: 17px; font-weight: bold;">@desc</span>
    </div>
         <img
                src="@imgs" height="100" alt="@imgs" width="100"
                style="float: left; margin: 0px 15px 15px 0px;"
                border="2"
            ></img>
          """))

Add the hovertool:

p.add_tools(hover)

Upvotes: 3

Related Questions