# Plotly - Show Legend Outside Graph without Blank Space

**URL:** <https://community.plotly.com/t/plotly-show-legend-outside-graph-without-blank-space/43053>\
**Category:** plotly.js\
**Created:** [July 28, 2020, 7:16am UTC](https://community.plotly.com/t/plotly-show-legend-outside-graph-without-blank-space/43053 "2020-07-28T07:16:32Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![ceds](https://avatars.discourse-cdn.com/v4/letter/c/4da419/32.png) [@ceds](https://community.plotly.com/u/ceds)\
**Post date:** [July 28, 2020, 7:16am UTC](https://community.plotly.com/t/plotly-show-legend-outside-graph-without-blank-space/43053/1 "2020-07-28T07:16:32Z")

</div>

I’m using Plotly to render dashboards on a product that we are developing. The charts in the dashboard can resize in terms of height and width.

The code for setting the legends are as follows:

> layout.legend = {  
> x: 0.5,  
> y: 1.15,  
> orientation: ‘h’,  
> xanchor:‘center’,  
> yanchor:‘top’,  
> font: {  
> size: this.legendFontSize,  
> },  
> };

The problem that I’m experiencing is with Plotly the legend Y position is a static value. Each chart height and legend font-size requires a unique Y position in order to make the chart look neat and professional. See below example where Y = 1.15. For a height of 400x it looks fine, however, the moment the chart height increases to 800px, there is a massive white space whereby the Y need to be manually adjusted through trial and error.

Other charting libraries like chart.js and apexcharts automatically adjust the legend without this problem. Is there any workaround in Plotly?

 ![Plot 2](https://us1.discourse-cdn.com/flex024/uploads/plot/original/2X/d/d719e869b669c74ce6175eb4f35c3e524ce7e6c3.jpeg)

 ![Plot 1](https://us1.discourse-cdn.com/flex024/uploads/plot/original/2X/a/ab5e2841ed897177d04e332213aefdad90f4a0cf.jpeg)