Implementing a slider ON an axis

Hello,

I am built a model that solves a 1D transport problem (upper plot) and now I want to add a second plot that shows the breakthrough curve at a given point. Is there a way to implement a range slider ON the x axis of the upper plot to determine the location of the breakthrough curve of the lower plot? Not sure whether this is important, but the range of the upper x-axis is adjustable too

You have a number of options to control x ranges… love this application btw :smiley:

Relevant doc: ranges — Bokeh 2.4.2 Documentation

The way I think about it, essentially you can control the range of the x axis 2 different ways, but both ways are actually quite flexible thanks to CustomJS access of the models:

  1. DataRange1d → this will rig the axis up to “auto” follow the range of particular renderers (in your case your BT curve), with additional args like how much to pad it etc. This is the default on initialization of a figure. So your second figure is plotting over the range of 11ish because that’s the extent of the renderer.

  2. Range1d → essentially “hard” coded start and end to the axis range.

Now you can dynamically control the args of BOTH of these via the magic of CustomJS, meaning for example, you could set the second figure’s x_range to a Range1d(start=0,end=10), but then every time a slider gets moved, trigger that callback, which does some calculation, like find where c(t)/c0 on the second figure reaches say 0.99, then update the figure’s x_range.start and end based on that.

OR, alternatively, and probably more conveniently based on what I think you want…you can set the x_range on the second plot to the x_range of the first plot → that’ will “tie” them together. Like this:

f1 = figure()
f2 = figure()
f2.x_range = f1.x_range

Hopefully this all makes sense, don’t hesitate to post a dummy example if you’re stuck on anything.

If you are asking about a UX control, there is a RangeTool (but note that it renders inside the plot as an overlay, not on an axis).