echarts icon indicating copy to clipboard operation
echarts copied to clipboard

[Bug] When the bar chart label is too long, it will exceed the coordinate system range and cover the y-axis label

Open liqiuqiui opened this issue 1 year ago • 4 comments

Version

5.5.0

Link to Minimal Reproduction

click this

Steps to Reproduce

click this

Current Behavior

When the bar chart label is too long, it will exceed the coordinate system range and cover the y-axis label image

Expected Behavior

The calculation of label position should take into account its length and always display it in the coordinate system image

Environment

- OS:
- Browser:
- Framework:

Any additional comments?

I tried to find the source code for label position calculation and made corrections, but I couldn't find it. Maybe someone can provide some ideas, thank you

liqiuqiui avatar Jun 05 '24 07:06 liqiuqiui

have you tried a combination of label's overflow, width and lineHeight? They are designed to help with long labels.

helgasoft avatar Jun 06 '24 06:06 helgasoft

have you tried a combination of label's overflow, width and lineHeight? They are designed to help with long labels.

In the case of dense x-axis, if overflow hiding is used, the number of displayed words will be too small

liqiuqiui avatar Jun 06 '24 06:06 liqiuqiui

Have you tried customizing the line wrapping operation by setting label.formatter? '\n' can be used The effect is as follows image

fandi-1205 avatar Jun 28 '24 06:06 fandi-1205

labelLayout(params) {
        console.log(params) // learn more about the params here
        return {
          x: Math.max(45, params.labelRect.x),
          y: params.labelRect.y
        };
      }

Ovilia avatar Jun 28 '24 07:06 Ovilia