Embed Plotly in html with responsive behavior: can I change legend position based on screen width?
I am using Plotly to embed a plot on an HTML page. My website is responsive, but I am not satisfied with the legend of the plot that I have embedded. Here you can see two screenshots: on the left, we see the plot on a widescreen, and on the right with a narrow one.
vs
As shown in the figure, the plot looks good on the widescreen (left). However, when the screen is narrow (right), the legend takes too much space and the plot is shrunk.
Moving the legend below when the screen is small would solve the issue (as depicted with the red drawing). Is it possible to embed such a responsive behavior in Plotly when adding the legend?
Thanks in advance! :)