jxramos
jxramos

Reputation: 8266

How to get Bokeh to scale scatter plot size according to zoom

Some of the folks on my team, including myself, find it pretty disorienting that in a Bokeh scatter plot, say using the circle method, that for an initial autoscale fit of the data on the figure we can dial in a reasonable size for our data, using for example something like plot.circle( x , y , size=3 )

However when we interactively zoom into our data the glyph sizes as displayed are invariant to the zoom. Is there a way to have them scale proportionally to the zoom we've dialed into? Something akin to an vector graphics interaction (eg svg). If memory serves me right matlab figures and matplotlib figures should maintain zoom proportionality behavior. To demonstrate the behavior we're seeing consider the first image and the red box I approximately zoom into on the second image.

initial zoom focused zoom

Just as a quick demo using Powerpoint to illustrate the sort of desired behavior... vector graphic example 1 vector graphic example 1 zoomed in

Upvotes: 8

Views: 5702

Answers (2)

jxramos
jxramos

Reputation: 8266

Here's a good demo by Bryan Van de Ven showing the difference between pixel coordinates (size) and data coordinates (radius) given in this conference talk:

Intro to Data Visualization with Bokeh - Part 2 - Strata Hadoop San Jose 2016

... the point is all of these attributes can be vectorized. We could for instance say size equals you know 2, 4, 6, 8, 10, and now the size is modulated right. So we have one that has size 2 and one that has size 4. Size is usually in pixels, radius is usually in data dimension units. But all the other ones here as well all the colors, all the visual attributes can be vectorized in this way. You can either give them a single value as we've done for instance with the line fill color, or you can give them a vector of values in which case all of the things are different.

So next exercise here you go to this notebook this is that second notebook "02 - plotting" it is to try to create the same example but now set the radius instead of the size and sort of see what's the difference if you set if you set radius instead of size.

Upvotes: 2

Luke Canavan
Luke Canavan

Reputation: 2137

For circles, set the radius kwarg instead of the size value. (There similar, glyph-specific values for the other glyph-types).

i.e.:

plot.circle(x=[1,2,3], y=[1,2,3], radius=0.5)

size is always rendered in screen coordinates (pixels), but radius and the related properties are computed in data coordinates and should change in magnitude with zooming.

Upvotes: 12

Related Questions