Add drag event to plot (part2)

[RickD]

it was suggested that in order to resize a plot that I embed the plot into html and then use javascript resize syntax. So instead I embedded my plot into Pyscript and did resizing with pure CSS

click this link then view source to see the code
https://rickd.s3.us-east-2.amazonaws.com/Pyscript+Template+with+div+resize+handle_2.html

but I would like a js_on_change event other than the tap event I am using. Is there a drag event to use?

[Bryan]

Bokeh drag events only apply to the canvas and AFAICT the drag handle is outside the canvas.

Do plot.width and plot.height not generate change events? There may be some reason that they don’t in responsive sizing modes (I don’t know for sure, offhand), but that’s what I would start with.

Edit: actually plot.inner_height and plot.inner_width might be better options to try, I think they should trigger regardless. Their values subtract any toolbar and other extra extents… they report the dimensions of the “plot frame”, i.e the axes, inside the canvas, which is actually what I think you want given that you are computing an angle…

[RickD]

when I use
p.inner_width.js_on_event(‘tap’, callback) or p.width

i get
AttributeError: ‘int’ object has no attribute ‘js_on_event’

perhaps replace ‘tap’ with something else?

[RickD]

correction, i get

bokeh.core.property.descriptors.UnsetValueError: figure(id=‘p1001’, …).inner_width doesn’t have a value set

[Bryan]

“event” callbacks are for UX events. I was suggesting a property change callback:

plot.js_on_change("inner_width", callback)

These properties should get updated internally by BokehJS whenever the dimensions change.

You want to get rid of the requirement for the user to tap, and have it update automatically, or did I misunderstand?

[RickD]

hey THANKS Bryan, this works very nicely

so as an aside, what do u think about Pyscript here?

[Bryan]

@RickD

so as an aside, what do u think about Pyscript here?

I don’t have any direct experience with it. Seems like a nice option to avoid having to deal with JavaScript.

@Philipp_Rudiger @James_A_Bednar1 @mateusz can probably comment about PyScript in more detail.

[RickD]

the beauty part of Pyscript is that I can share my files like I am doing with you. If u click my link again , then view source , u will see the changes I made

[RickD]

also can write both bokeh and python using only a notepad, then resave as hrml file

[Philipp_Rudiger]

PyScript is great! As a separate plug, using Panel you can take (almost) any Bokeh and (Panel) app and convert it to Pyodide or PyScript from the commandline without writing any HTML boilerplate. See these docs for more details.