How to annotate a point outside the plot itself?

Question:

I have a plot like this and want to add text above the line with text ‘TODAY’.

enter image description here

I was trying with annotations

annots.append(dict(x='2020-03-29',y=len(df)+1,text='<b>Today<b>', showarrow=False, font=dict(color='black')))

But the output is as such and I want it above the plot and not changing the structure of the plot!
enter image description here

Asked By: szczor1

||

Answers:

You can do so in three steps:

  1. adjust margins to make room for the text using fig.update_layout(margin=dict())
  2. add line using fig.add_shape()
  3. add text outside plot using add_annotation(yref='paper', y=1.06) where y > 1 places the annotation outside the boundaries of the axes.

See code snippet for details

Plot:

enter image description here

Complete code:

# imports
from plotly.offline import download_plotlyjs, init_notebook_mode, plot, iplot
from IPython.core.display import display, HTML
import plotly.figure_factory as ff
import plotly.graph_objs as go

# setup
display(HTML("<style>.container { width:50% !important; } .widget-select > select {background-color: gainsboro;}</style>"))
init_notebook_mode(connected=True)

#%qtconsole --style vim

# dates
StartA = '2009-01-01'
StartB = '2009-03-05'
StartC = '2009-02-20'

FinishA='2009-02-28'
FinishB='2009-04-15'
FinishC='2009-05-30'

LabelDateA='2009-01-25'
LabelDateB='2009-03-20'
LabelDateC='2009-04-01'

# sample data
df = [dict(Task="Task A", Start=StartA, Finish=FinishA),
      dict(Task="Task B", Start=StartB, Finish=FinishB),
      dict(Task="Task C", Start=StartC, Finish=FinishC)]

# figure
fig = ff.create_gantt(df)

# add annotations
annots =  [dict(x=LabelDateA,y=0,text="Task label A", showarrow=False, font=dict(color='white')),
           dict(x=LabelDateB,y=1,text="Task label B", showarrow=False, font=dict(color='White')),
           dict(x=LabelDateC,y=2,text="Task label C", showarrow=False, font=dict(color='White'))]

# plot figure
fig['layout']['annotations'] = annots


# Step 1 - adjust margins to make room for the text
fig.update_layout(margin=dict(t=150))

# Step 2 - add line
fig.add_shape(type='line',
                x0=LabelDateB,
                y0=0,
                x1=LabelDateB,
                y1=1,
                line=dict(color='black', dash='dot'),
                xref='x',
                yref='paper'
)

# Step 3 - add text with xref set to x
# and yref set to 'paper' which will let you set
# text outside the plot itself by specifying y > 1
fig.add_annotation(dict(font=dict(color="black",size=12),
                            #x=x_loc,
                            x=LabelDateB,
                            y=1.06,
                            showarrow=False,
                            text='<b>Today</b>',
                            textangle=0,
                            xref="x",
                            yref="paper"
                           ))

fig.update_layout(
    title_text="Academic year 2019/2020"
)

fig.show()
Answered By: vestland
Categories: questions Tags: , ,
Answers are sorted by their score. The answer accepted by the question owner as the best is marked with
at the top-right corner.