Change position of title?

plotly.js
1

I would like to change the x,y of the g-title element based on some logic. Specifically

  • I have particular chart sizes
  • I have 3 or more series to plot
  • My legend must go above the chart but below the chart title
  • I can only fit two series labels per line in the legend

So, this isn’t a problem, I can use legend groups and derive a sensible layout.legend.y value based on how many groups I have. However, with each legend group, the legend needs to move up and it covers the chart title. I’d like to also move the chart title up accordingly (change the y attribute on the <g> for the title). However I don’t see a way to set this. Is it possible? Or is there some better way to achieve my goal? Example of what I’m talking about:

Thanks

2

Thanks for writing in.

I’d vote for adding x and y (along with xanchor and yanchor) attributes to layout.title - making the title position configurable the same as our other layout components.

What do you think?

3

Sounds good. I can take a stab if you wouldn’t mind pointing me to the
relevant code. Thx

4

@MFed Fantastic!

Titles are drawn via Titles.draw. Looking up the Legend and RangeSelector draw routine (1 and 2) should help you figure out the positioning logic.

Let me know if you have any other questions!

5

@etienne a few questions after looking into this - changing layout.title from a string to an object (which i think is what you’re suggesting) is a breaking change right? what is your policy on that - meaning is it fine to change title to an object with text, x, y, xanchor, yanchor (maybe even font rather than having that be a separate thing) and when people upgrade, they’ll need to change accordingly?

Titles.draw seems to be called for multiple things (more than just the main title). The most straightforward approach here seems to be to put the logic for x/y/xanchor/yanchor in plot_api.drawMainTitle. Does that seem correct to you? Is referring to legend.anchor_utils from plot_api also correct? Probably moving that out of legend as its already shared by more than legend and doesn’t seem so legend specific is more correct although i’d like to try to not increase my scope of refactor too much.

6

Oh right. I forgot about that.

We can’t make any breaking changes at the moment. I guess we’ll have to wait for v2.0.0 this fall. I’ll open a ticket about it in the GitHub repo.

7

Ok. Can you think of any way in which I can hack to get around this in the meantime?

8

The easiest title hack is to not show a title and use an annotation instead.

9

Is there any update on this? Adjusting vertically and horizontally the title.