Skip to content

fix: end-of-line label collision + padR for clean PNG export - #1673

Merged
Flotapponnier merged 1 commit into
devfrom
fix/chart-label-collision
Jul 29, 2026
Merged

fix: end-of-line label collision + padR for clean PNG export#1673
Flotapponnier merged 1 commit into
devfrom
fix/chart-label-collision

Conversation

@Flotapponnier

Copy link
Copy Markdown
Collaborator

What

The PNG export (and live chart) had two issues when many providers are displayed:

  1. End-of-line labels all stacked on top of each other when providers shared similar Y values
  2. Long names like "0x7cc0...e781" got clipped by the SVG viewport (padR=96 gave only 88px)

Fix

  • Collision deflection: labels are now sorted by their natural Y position and each is pushed down until it clears the previous one (27px minimum gap = name line + value line + margin)
  • Top-10 cap: only the top 10 non-excluded lines get inline labels. The HTML legend below still shows all providers. Avoids right-side clutter on 100+ provider charts like HL frontends
  • padR 96 → 130: gives ~140px for label text, enough for truncated addresses and long names without clipping

- Limit inline labels to top 10 non-excluded lines (legend shows all)
- Collision deflection: sort labels by Y, push each down until clear of previous
- Increase padR 96→130 so label text never gets clipped by SVG viewport
@Flotapponnier
Flotapponnier merged commit 07e06ed into dev Jul 29, 2026
1 check failed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant