Learn how to use Dash Bio for next-gen sequencing & quality control. 🧬Register for the Oct 27 webinar.

PlotlyJS Annotation Arrow angles

Hi,
How can I understand the angle logic for the annotation arrows?

I am working on a project where I want to draw an arrow which user can hold from the tail end and move the tail around to change the angle of the arrow towards the point. This works using annotation arrows and is perfect for my use case. But I am not able to understand how the angle logic works for them.

Here are 3 angles and their screenshots, 0 degrees and 45 degrees appear to work correctly, but 90 degrees does not looks valid (if 45 degree was half-way inclined compared to 0 degree, I expect 90 degree to be an horizontal arrow), and this makes me think it’s not that straightforward.

  1. Zero degree:
    zero_degree

  2. 45 degree:
    45_degree

  3. 90 degree:
    90_degree

In all these cases, I am changing the value of “ax” of annotations as mentioned in this documentation:

I currently don’t understand what “ax” and “axref” is, even though I know changing “ax” does change the angle of the annotation arrow. I have also seen that for the same incline, the “ax” value differs if “ay” value is changed.

If someone can help or guide, it will really help.

Thanks.