Hovertext multiple columns

Hi,

I created a map of the world where hovering over countries would show a list of information (sometimes 100+)

Because I could not display it all in one column (using
), I started to make three columns out of it. The problem is I can’t have it cleanly displayed (see screenshot)
The lines are currently built by concatenating strings from a pandas dataframe as per below code:

for a,b,c in zip(list[::2],list[1::2], list[2::3]):
temp_str = temp_str + ‘{:<40} {:<40} {:<}
’.format(a,b,c)

Where “list” is a list of companies per country

Does anyone know how I could display it properly? And/or display a table in the “hover bubble”?
I tried adding HTML table tags, but no luck there…

Thanks a lot!!

Hi @matt784,

Welcome to the forums! I think the reason that you’re “columns” aren’t lining up the way you want is because the default hover label font is proportional rather than monospace (See https://en.wikipedia.org/wiki/Monospaced_font). You could try using a monospace font like “Courier New”. You would do this by setting the scatter.hoverlabel.font.family property to 'Courier New'.

Hope that helps!
-Jon

Amazing, that did it!

Thanks a lot!

1 Like