# How to add a text area with custom text as a kind of legend in a plotly plot

**URL:** <https://community.plotly.com/t/how-to-add-a-text-area-with-custom-text-as-a-kind-of-legend-in-a-plotly-plot/24349>\
**Category:** 📊 Plotly Python\
**Created:** [June 10, 2019, 6:54am UTC](https://community.plotly.com/t/how-to-add-a-text-area-with-custom-text-as-a-kind-of-legend-in-a-plotly-plot/24349 "2019-06-10T06:54:37Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![ULTRA](https://avatars.discourse-cdn.com/v4/letter/u/a587f6/32.png) [@ULTRA](https://community.plotly.com/u/ULTRA)\
**Post date:** [June 10, 2019, 6:54am UTC](https://community.plotly.com/t/how-to-add-a-text-area-with-custom-text-as-a-kind-of-legend-in-a-plotly-plot/24349/1 "2019-06-10T06:54:37Z")

</div>

Is it possible to add a custom text area (like a legend but I should be able to add my own text) in a python plotly plot ?

---

<div class="post-metadata">

**Author:** ![jmmease](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/jmmease/32/3706_2.png) [@jmmease](https://community.plotly.com/u/jmmease)\
**Post date:** [June 10, 2019, 12:55pm UTC](https://community.plotly.com/t/how-to-add-a-text-area-with-custom-text-as-a-kind-of-legend-in-a-plotly-plot/24349/2 "2019-06-10T12:55:47Z")

</div>

Hi @ULTRA,

Yes, you can do this with a text annotation in paper coordinates. There is an example at [https://plot.ly/python/text-and-annotations/#adding-annotations-with-xref-and-yref-as-paper](https://plot.ly/python/text-and-annotations/#adding-annotations-with-xref-and-yref-as-paper) where annotations are used as replacements for axis labels.

Also, if you need to have text spread across multiple lines you can add line breaks by inserting `<br>` sequences.

Hope that helps!

-Jon

---

<div class="post-metadata">

**Author:** ![ULTRA](https://avatars.discourse-cdn.com/v4/letter/u/a587f6/32.png) [@ULTRA](https://community.plotly.com/u/ULTRA)\
**Post date:** [June 11, 2019, 9:02am UTC](https://community.plotly.com/t/how-to-add-a-text-area-with-custom-text-as-a-kind-of-legend-in-a-plotly-plot/24349/3 "2019-06-11T09:02:10Z")

</div>

Hello @jmmease,

I am a bit confused at the explanation you have given 😅  
Basically, I was looking for something similar across the lines of this image :  
 ![Capture](https://us1.discourse-cdn.com/flex024/uploads/plot/original/2X/0/03648bcf30819f71e13dcd4d8c3f4d67930d3adf.png)  
Here there are 2 text boxes besides the plot with some custom information. Is there a way to achieve something similar to this ?

---

<div class="post-metadata">

**Author:** ![jmmease](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/jmmease/32/3706_2.png) [@jmmease](https://community.plotly.com/u/jmmease)\
**Post date:** [June 11, 2019, 11:57am UTC](https://community.plotly.com/t/how-to-add-a-text-area-with-custom-text-as-a-kind-of-legend-in-a-plotly-plot/24349/4 "2019-06-11T11:57:56Z")

</div>

Hi @ULTRA,

Here’s a full example of what I was talking about:

```python
import plotly.io as pio
import plotly.graph_objs as go
from plotly.offline import init_notebook_mode, iplot
init_notebook_mode()

fig = go.Figure(
    data=[
        go.Scatter(y=[2, 1, 3])
    ],
    layout=go.Layout(
        annotations=[
            go.layout.Annotation(
                text='Some<br>multi-line<br>text',
                align='left',
                showarrow=False,
                xref='paper',
                yref='paper',
                x=1.1,
                y=0.8,
                bordercolor='black',
                borderwidth=1
            )
        ]
    )
)
iplot(fig)

```

 ![newplot%20(7)](https://us1.discourse-cdn.com/flex024/uploads/plot/original/2X/a/a784141d9b7554d208bddcd93b9f561bdfc9258e.png)

Hope that helps,  
-Jon

---

<div class="post-metadata">

**Author:** ![ULTRA](https://avatars.discourse-cdn.com/v4/letter/u/a587f6/32.png) [@ULTRA](https://community.plotly.com/u/ULTRA)\
**Post date:** [June 11, 2019, 12:11pm UTC](https://community.plotly.com/t/how-to-add-a-text-area-with-custom-text-as-a-kind-of-legend-in-a-plotly-plot/24349/5 "2019-06-11T12:11:08Z")

</div>

Is it possible to embed more complex html in the text attribute ?

---

<div class="post-metadata">

**Author:** ![jmmease](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/jmmease/32/3706_2.png) [@jmmease](https://community.plotly.com/u/jmmease)\
**Post date:** [June 13, 2019, 10:22am UTC](https://community.plotly.com/t/how-to-add-a-text-area-with-custom-text-as-a-kind-of-legend-in-a-plotly-plot/24349/7 "2019-06-13T10:22:47Z")

</div>

Hi @ULTRA,

> [@ULTRA](#):
>
> Is it possible to embed more complex html in the text attribute ?

Here is the subset of HTML that is supported: [Links, Text, and HTML in Graphs](https://help.plot.ly/adding-HTML-and-links-to-charts/).

-Jon

---

<div class="post-metadata">

**Author:** ![RylanSchaeffer](https://avatars.discourse-cdn.com/v4/letter/r/6f9a4e/32.png) [@RylanSchaeffer](https://community.plotly.com/u/RylanSchaeffer)\
**Post date:** [December 8, 2019, 3:28pm UTC](https://community.plotly.com/t/how-to-add-a-text-area-with-custom-text-as-a-kind-of-legend-in-a-plotly-plot/24349/8 "2019-12-08T15:28:49Z")

</div>

@jmmease it looks like color isn’t supported?

---

<div class="post-metadata">

**Author:** ![RylanSchaeffer](https://avatars.discourse-cdn.com/v4/letter/r/6f9a4e/32.png) [@RylanSchaeffer](https://community.plotly.com/u/RylanSchaeffer)\
**Post date:** [December 8, 2019, 3:30pm UTC](https://community.plotly.com/t/how-to-add-a-text-area-with-custom-text-as-a-kind-of-legend-in-a-plotly-plot/24349/9 "2019-12-08T15:30:04Z")

</div>

Also, what is the role of the x, y coordinates? Based on your example above, they don’t appear to determine the location of the box.

Upon further exploration, it appears that they represent fractions of the plot e.g. if x=0.9, the x-coordinate of the box will start at the 90% of the width of the plot.
