CODEWITHSUNDEEP
pythonpython-3.xplotly
Dana_Miles
Dana_Miles

Reputation: 429

Python: Create annotation space above the graph in Plotly

I would like to create additional space for annotations within the plot (see green area in attached image). At the moment, the y-axis defines my height of the plot. Can I push the plot beyond the y.max limit/hide the y-axis after a certain point (marked red in the image)? I try to avoide the axis reaching into the 'comment section' (green).

Thank you!

enter image description here

enter image description here

Upvotes: 3

Views: 3297

Answers (2)

33fred33
33fred33

Reputation: 67

Annotations have x and y as parameters. If your y exceeds the max y in your plot, the space will extend above to reach y.

For example, adding the following annotation with y=32, the text lands inside of the plot (max y is at around 50):

plot.add_annotation(x=30, y=32,
            text="Text annotation with arrow",
            showarrow=True,
            arrowhead=1)

Plot with annotation with y < max y

And changing y=32 to y=52 the plot looks like this:

Plot with annotation with y > max y

As you see, the max y in the plot increased to over 60 to allow the annotation to find its place

Upvotes: 0

s3dev
s3dev

Reputation: 9701

I stumbled on this question after answering another of your questions and thought it was interesting.

Is this what you're after?

Key Elements:

The key elements of creating the elevated annotation are:

  • xref and yref are set to 'paper', thus using the graph's background for xy coordinates rather than graph data values
  • Using > 1.00 for the y positioning
  • layout['margin'] top set to a value to create a top margin, thus pushing the graph area down

Sample Code:

It's really much simpler than it looks.

import numpy as np
from plotly.offline import iplot

# Create the dataset.
n = 360
x = np.arange(n)
y = [np.sin(i*(np.pi/180)) for i in range(n)]

# Plot the sin wave.
data = []
data.append({'x': x,
             'y': y})

# Create the annotations.
notes = []
notes.append({'text': ('An annotation at the top of the graph.<br><br>'
                       'And some more rambling text to take up some '
                       'more space on the graph to represent<br>'
                       'a longer annotation, just because we can.<br><br>'
                       'And one more for good measure.'),
              'x': 0.00,
              'y': 1.60,
              'xref': 'paper',
              'yref': 'paper',
              'showarrow': False,
              'align': 'left'})
notes.append({'text': 'Elevated Graph Annotation Example',
              'x': 0.00,
              'y': 1.15,
              'xref': 'paper',
              'yref': 'paper', 
              'showarrow': False,
              'font': {'size': 18}})

# Setup the layout.
layout = {}
layout['annotations'] = notes
layout['margin'] = {'t': 175}

# Plot the data. (May also use `plot` rather than `iplot`)
iplot({'data': data, 'layout': layout})

Note:

You'll have to create your own graph title (rather than relying on the title parameter available in layout) as you'll need to position the graph title yourself. Otherwise the automatic title and annotations will overlap.

Upvotes: 6

Related Questions