Skip to content

fix(legend): use bottom:0 default so legend no longer overlaps axis labels - #21726

Open
waterWang wants to merge 1 commit into
apache:masterfrom
waterWang:fix/legend-bottom-overlap-21662
Open

fix(legend): use bottom:0 default so legend no longer overlaps axis labels#21726
waterWang wants to merge 1 commit into
apache:masterfrom
waterWang:fix/legend-bottom-overlap-21662

Conversation

@waterWang

Copy link
Copy Markdown

Problem

When the chart has a grid with a bottom offset (or containLabel: true), the legend overlaps with the x-axis labels. This is because the default legend position is bottom: tokens.size.m (15px from the container bottom), which places the legend too close to the grid's bottom edge where axis labels are rendered.

Steps to Reproduce

  1. Create a stacked line chart with grid: { bottom: 80 } (or any explicit bottom value)
  2. Observe the legend overlapping with the x-axis labels

Current Behavior

Legend overlaps axis labels when the grid has a bottom offset.

Workaround

legend: {
  bottom: 0,
  padding: [0, 0, 2, 0]
}

Fix

Changed the default bottom from tokens.size.m (15px) to 0. This pushes the legend to the container's bottom edge, leaving the space between the grid and the legend to the axis labels. Users can still override with an explicit bottom value.

Related

Closes #21662

…abels

The default legend position used bottom: tokens.size.m (15px) from the
container bottom. When the grid has its own bottom offset or containLabel
is configured, the x-axis labels extend below the grid and can overlap
with the legend sitting 15px up.

Setting the default bottom to 0 pushes the legend down to the container's
bottom edge, leaving the space between grid and legend to the axis labels,
which matches how the layout reference is consumed. Users can still
override with an explicit 'bottom'. Closes apache#21662.
@echarts-bot

echarts-bot Bot commented Aug 10, 2026

Copy link
Copy Markdown

Thanks for your contribution!
The community will review it ASAP. In the meanwhile, please checkout the coding standard and Wiki about How to make a pull request.

Please DO NOT commit the files in dist, i18n, and ssr/client/dist folders in a non-release pull request. These folders are for release use only.

To reviewers: If this PR is going to be described in the changelog in the future release, please make sure this PR has one of the following labels: PR: doc ready, PR: awaiting doc, PR: doc unchanged

This message is shown because the PR description doesn't contain the document related template.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Bug] Legend overlaps axis labels

1 participant