How do I add line `y=x` with `ray` method? I could not set gradient of line to 45° in data units

What would I like to do?

I would like to add infinite line y = x to chart.

I executed the following code.

plot = figure()
plot.scatter(x=[1, 10, 100], y=[1,2,4])
plot.ray(x=[0], y=[0], length=0, angle=math.pi/4)
show(plot)

The gradient is 45° in screen units but is not 45° in data units.
The line is not y = x

Question

How do I add line y=x with ray method?

Environmental

  • Python3.10.2
  • bokeh 2.4.3

Supplementary

I referred to the following site.

Interesting that it plots the angle in screen units and not data units and I can’t seem to find a property to alter that in the docs. The actual devs may have a better answer than me, but I’d probably implement a CustomJSTransform workaround in the meantime. Do you need “infinite length”? (i.e. length=[0])

2 Likes

The Ray glyph processes the angle by making a rotation of the HTML canvas:

 ctx.rotate(angle_i)

before drawing the line, so the angle will always ultimately reflect a rotation in pixel space, not data-space. This is yet another case where a mismatch between data-space aspect ratio and pixel-space aspect ratio leads to unavoidable results. In general, any glyph that supports any sort of “angle” or “rotation” is going to be sensitive to aspect ratios in this way.

The simplest solution would be to set match_aspect=True on the plot. If that’s not feasible for some reason, you will have to look at other solutions besides Ray. e.g. manually drawing a “very long” line to simulate infinite length, or using a CustomJSTransform as @gmerritt123 suggests.

1 Like

Thanks!

I understood why angle is screen units.

I give up drawing infinite line and I am going to draw “very long” line manually.

1 Like