'Count number data points from plot with bokeh box select

I am using the following code(example from bokeh page) to select data points from one plot with box select and copy them on a second plot. In addition, I want to count the number of data points that are selected with the box select tool and have the result printed in a separate box something like this maybe enter image description here

How could I do that?

Thanks


    from random import random

    from bokeh.layouts import row
    from bokeh.models import ColumnDataSource, CustomJS
    from bokeh.plotting import figure, output_file, show

    output_file("callback.html")

    x = [random() for x in range(500)]
    y = [random() for y in range(500)]

    s1 = ColumnDataSource(data=dict(x=x, y=y))
    p1 = figure(width=400, height=400, tools="lasso_select", title="Select Here")
    p1.circle('x', 'y', source=s1, alpha=0.6)
    
    s2 = ColumnDataSource(data=dict(x=[], y=[]))
    p2 = figure(width=400, height=400, x_range=(0, 1), y_range=(0, 1),
                tools="", title="Watch Here")
    p2.circle('x', 'y', source=s2, alpha=0.6)
    
    s1.selected.js_on_change('indices', CustomJS(args=dict(s1=s1, s2=s2), code="""
            const inds = cb_obj.indices;
            const d1 = s1.data;
            const d2 = s2.data;
            d2['x'] = []
            d2['y'] = []
            for (let i = 0; i < inds.length; i++) {
                d2['x'].push(d1['x'][inds[i]])
                d2['y'].push(d1['y'][inds[i]])
            }
            s2.change.emit();
        """)
    )

    layout = row(p1, p2)
    
    show(layout)



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source