echarts 图例内容过长 超出部分省略号显示

1,229 阅读1分钟

在 Echarts 中,可以通过设置图例(legend)的 formatter 属性来自定义图例文本的显示。如果文本内容过长,可以在 formatter 中加入省略号来处理。示例代码:

legend: {
    orient: 'vertical', // 垂直排列
    right: 10,
    type: 'scroll', // 启用滚动条
    itemGap: 12, // 图例每项之间的间隔
    itemWidth: 10,
    itemHeight: 10,
    textStyle: {
      fontSize: 14,
      color: '#606266',
      lineHeight: 22
    },
    formatter: function (name) {
        if (name.length > 10) {
            return name.substring(0, 10) + '...';
        } else {
            return name || '未知';
        }
    }
  },

image.png