Get screen units of figure's plot area, OR converting between screen and data units on a figure

Community Support
1

Say I have a figure instantiated:

#could spec frame width/height too but ends in same issue
f = figure(height=800,width=500)

In a JS callback I want to get the pixel values (i.e. screen space coords) of the plot area’s lower left (i.e. origin) and upper right corner. I started this thinking I could get it using the JS-side computed outer/inner height/width:

var ox_pixel = f.outer_width-f.inner_width
var oy_pixel = g.outer_height-f.inner_height

But this doesn’t actually work because there’s border space on either side of the figure’s plot area - space for axes ticks, labels, titles, toolbars, other layout type things etc. I don’t know how to access the computed “border padding” on either side.

I looked at the “above”,“below”, “left” and “right” properties on the figure (accessing an array of layouts located on the respective sides of the plot area), but they don’t seem to yield a computed height/width for each.

There are also min_border_top etc. properties you can assign but obviously that’s just the “minimum” obviously and not the computed value.

Another idea I had was to somehow send a manufactured tap event to data units (0,0) and see if I could get a corresponding sx/sy computed… or even go the other way and send a tap event at screen units (0,0) and work it out from there. But that hasn’t worked because I can’t seem to access the (deep in the source code) method that translates data units and screen units (really if I could figure out an easy way to do that I’d be golden too).

Any ideas?? Thanks…

2

On the plot view object, I think you can look at frame.bbox

cc @mateusz

3

How do I look at the plot_view object? That’d definitely give something new to look at/try. (I’ve been confused by this for a while actually).

I console.log(figure) and try to drill down to find the “js-side only” computed plot view stuff but haven’t been able to find plot_view? Is it in the prototype or something?

4

That’s actually a really good question, and I am not sure I know the best current answer. AFAIK it has not changed that models do not have back-references to any views of them. There is a window global Bokeh.index mapping that contains all the top-level views, and the views do have references to their model. So it’s definitely possible (though a pain) to trawl down through that structure looking for the plot view corresponding to the plot model you care about.

But possibly @mateusz can point to some more recent, better way to accomplish this that I missed.

5

That was all I needed :smiley:

How I retrieved it:

        //where fig_id is the id property of the figure in question
        function find_view(el,id){
            for (let v of el.child_views){
                    if (v.model.id === id){
                            console.log(v)
                            return {'ib':v.frame.bbox}
                            }
                    else {
                        if (v.child_views){
                                find_view(v,id)
                                }
                        }
                    }
            }
        var b = find_view(Bokeh.index[Object.keys(Bokeh.index)[0]],fig_id)

Thanks for the quick response, that was quite the hurdle you just helped me over.