Bokeh: One url per glyph

Question

I have a set of datapoints, each with a url unique to it. What I want to do is to be able to scatter plot my data, and then open the associated url when clicking the glyph. I have read the discussion here and followed the example here, but neither gets me where I want to be.

I have, somewhat arbitrarily and haphazardly, tried to save the urls in the tag property, to be recalled by the TapTool:

from bokeh.models import OpenURL, TapTool
from bokeh.plotting import figure, show

p = figure(plot_width = 1200,
           plot_height = 700,
           tools = 'tap')

p.circle(data_x,
         data_y,
         tags = list(data_urls))

taptool = p.select(type = TapTool, arg = "tag")
taptool.callback = OpenURL(url = '@tag')

show(p)

I have not been able to find any place in the Bokeh documentation that explains the nuts and bolts needed to assemble the behaviour that i want. At least not in terms I can understand.

Could someone please point me in the right direction? Thanks!

Answer 1

The tags property is not relevant, and largely disused. You need to put the URLs in a column in the plot data source, so that the OpenURL callback can access it:

from bokeh.models import ColumnDataSource, OpenURL, TapTool
from bokeh.plotting import figure, show

p = figure(plot_width=400, plot_height=400,
           tools="tap", title="Click the Dots")

source = ColumnDataSource(data=dict(
    x=[1, 2, 3, 4, 5],
    y=[2, 5, 8, 2, 7],
    color=["navy", "orange", "olive", "firebrick", "gold"]
    ))

p.circle('x', 'y', color='color', size=20, source=source)

# use the "color" column of the CDS to complete the URL
# e.g. if the glyph at index 10 is selected, then @color
# will be replaced with source.data['color'][10]
url = "http://www.colors.commutercreative.com/@color/"
taptool = p.select(type=TapTool)
taptool.callback = OpenURL(url=url)

show(p)

This example is documented (and live) here:

https://docs.bokeh.org/en/latest/docs/user_guide/interaction/callbacks.html#openurl