Skip to content

Ability to constrain legend background to the legend text #4132

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
chriddyp opened this issue Aug 16, 2019 · 5 comments · Fixed by #4160
Closed

Ability to constrain legend background to the legend text #4132

chriddyp opened this issue Aug 16, 2019 · 5 comments · Fixed by #4160
Assignees
Labels
bug something broken

Comments

@chriddyp
Copy link
Member

In this example, the legend's background color spans the entire width of the graph. It'd be nice if it only spanned the legend text, so that the lines on the right of the graph aren't beneath the semi-transparent white legend background.

image

@etpinard etpinard self-assigned this Aug 16, 2019
@etpinard etpinard added the bug something broken label Aug 16, 2019
@etpinard
Copy link
Contributor

Fixed in https://github.com/plotly/plotly.js/compare/drop-firstRender-in-legend-draw

will be part of 1.50.0

@chriddyp
Copy link
Member Author

nice!

@etpinard
Copy link
Contributor

Actually, I can't even reproduce this bug on latest, let alone on my dev branch.

My attempt: https://codepen.io/etpinard/pen/OJLXRJa?editors=1010

Which font are you using?

@etpinard
Copy link
Contributor

https://codepen.io/etpinard/pen/OJLXRJa?editors=1010 now has a minimal reproducible example.

The problem happens with horizontal legends when legendgroup is set.

etpinard added a commit that referenced this issue Aug 19, 2019
etpinard added a commit that referenced this issue Aug 19, 2019
- which gives better margin pushes,
  fixes legendgroup_horizontal_wrapping mock
etpinard added a commit that referenced this issue Aug 30, 2019
etpinard added a commit that referenced this issue Aug 30, 2019
- which gives better margin pushes,
  fixes legendgroup_horizontal_wrapping mock
etpinard added a commit that referenced this issue Aug 30, 2019
etpinard added a commit that referenced this issue Aug 30, 2019
- which gives better margin pushes,
  fixes legendgroup_horizontal_wrapping mock
etpinard added a commit that referenced this issue Aug 30, 2019
etpinard added a commit that referenced this issue Aug 30, 2019
- which gives better margin pushes,
  fixes legendgroup_horizontal_wrapping mock
etpinard added a commit that referenced this issue Aug 30, 2019
etpinard added a commit that referenced this issue Aug 30, 2019
- which gives better margin pushes,
  fixes legendgroup_horizontal_wrapping mock
etpinard added a commit that referenced this issue Aug 30, 2019
etpinard added a commit that referenced this issue Aug 30, 2019
- which gives better margin pushes,
  fixes legendgroup_horizontal_wrapping mock
- use per-item width for toggle-rect width in ALL horizontal legends,
  we could eventually compute "per-column" width, if
  someone finds it useful
etpinard added a commit that referenced this issue Aug 30, 2019
etpinard added a commit that referenced this issue Aug 30, 2019
- which gives better margin pushes,
  fixes legendgroup_horizontal_wrapping mock
- use per-item width for toggle-rect width in ALL horizontal legends,
  we could eventually compute "per-column" width, if
  someone finds it useful
etpinard added a commit that referenced this issue Aug 30, 2019
etpinard added a commit that referenced this issue Aug 30, 2019
- which gives better margin pushes,
  fixes legendgroup_horizontal_wrapping mock
- use per-item width for toggle-rect width in ALL horizontal legends,
  we could eventually compute "per-column" width, if
  someone finds it useful
etpinard added a commit that referenced this issue Aug 30, 2019
etpinard added a commit that referenced this issue Aug 30, 2019
- which gives better margin pushes,
  fixes legendgroup_horizontal_wrapping mock
- use per-item width for toggle-rect width in ALL horizontal legends,
  we could eventually compute "per-column" width, if
  someone finds it useful
etpinard added a commit that referenced this issue Aug 30, 2019
etpinard added a commit that referenced this issue Aug 30, 2019
- which gives better margin pushes,
  fixes legendgroup_horizontal_wrapping mock
- use per-item width for toggle-rect width in ALL horizontal legends,
  we could eventually compute "per-column" width, if
  someone finds it useful
etpinard added a commit that referenced this issue Aug 30, 2019
etpinard added a commit that referenced this issue Aug 30, 2019
- which gives better margin pushes,
  fixes legendgroup_horizontal_wrapping mock
- use per-item width for toggle-rect width in ALL horizontal legends,
  we could eventually compute "per-column" width, if
  someone finds it useful
etpinard added a commit that referenced this issue Sep 19, 2019
etpinard added a commit that referenced this issue Sep 19, 2019
- which gives better margin pushes,
  fixes legendgroup_horizontal_wrapping mock
- use per-item width for toggle-rect width in ALL horizontal legends,
  we could eventually compute "per-column" width, if
  someone finds it useful
@jensb
Copy link

jensb commented Oct 11, 2019

How do you get the semi-transparent legend background in your screenshot above?
It's possible to set bgcolor=rgba(x,y,z,128) for example but it's ignored. Only 0 (transparent) or >0 (non-transparent) seem to have any effect.
Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug something broken
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants