Get Values from Plot by Taptool Multiple Selection

Community Support
1

Hi, does anyone know how to select multiple points by using TapTool with CustomJS callback? I’m trying to select 10 points from scatter plot and get the values, but I don’t know how to get those 10 points. The codes below can select only one point from plot, but I want to select 10 points.

from random import random
from bokeh.models import CustomJS, ColumnDataSource, TapTool, Row
from bokeh.plotting import figure
from bokeh.io import curdoc
from bokeh.models.widgets import Button

x = [random() for x in range(500)]
y = [random() for y in range(500)]
source = ColumnDataSource(data=dict(x=x, y=y))

source2 = ColumnDataSource(data = dict(x = [], y = []))

callback = source.selected.js_on_change('indices', 
CustomJS(args=dict(source=source, source2=source2), code="""
    var inds = cb_obj.indices;
    var d1 = source.data;
    var d2 = source2.data;
    d2['x'] = []
    d2['y'] = []
    for (var i = 0; i < inds.length; i++) {
        d2['x'].push(d1['x'][inds[i]])
        d2['y'].push(d1['y'][inds[i]])
    }
    source2.data = d2
""")
)

def get_values():
    print(source2.data)     

taptool = TapTool(callback=callback)
p = figure(tools=[taptool], title="Select Here")
p.circle('x', 'y', source=source, alpha=0.6)

button = Button(label="Get selected set")
button.on_click(get_values)

curdoc().add_root(Row(p, button))
curdoc().title = "my dashboard"
2

@mahenndra

The tap-tool supports <shift>+mouse-click gestures to select multiple items, and your code works as expected from that standpoint.

Example server console output when selecting three points and pressing the button to display selected items …

{'x': [0.7154855691653691, 0.7353131058185459, 0.7777884954022308], 'y': [0.6732700391225849, 0.6692697995233566, 0.6615395908754824]}

Are you trying to do something else?

1 Like
3

Yes, that’s what I’m trying to do. Thank you!