Custom Pie Chart Annotation with Arrow Positions

Hi, I’m trying to plot a pie chart (go.Pie) having 2 portions with annotation texts (fig.add_annotation) with arrows. I want the head side of the arrow to be fixed at one single position while the tail side changes according to the proportion between both slices of the pie chart.

I have tried 2 approaches.

  1. I tried calculate the position of each tail (x and y, with ref=‘paper’) but the problem is that (ax and ay) are in the unit of “pixel” so I cannot find a robust way to specify these values for different screen size and zooming when I deploy this figure in dashboard.

  2. I also tried to plot each line manually in cartesian coordinate since it’s much easier to calculate the position of each arrow end. But the problem is that the pie chart is always overlaid on top of everything since it’s not a part of the plot so the lines are always located under the pie chart.

Can someone please help me with this problem?