Echarts 折线图文本如何设置上下不同颜色？

echarts 折行文本上下颜色如何调整

问题：

如何使用 echarts 为折行文本上下设置不同的样式？

答案：

echarts 中折行文本上下样式可以通过修改 rich 样式对象来实现。

以下示例代码演示了如何设置折行文本上半部分为红色，下半部分为蓝色：

option = {
  rich: {
    line: {
      color: '#ff0000',
      align: 'center',
      fontSize: 12,
    },
    desc: {
      color: '#0000ff',
      align: 'center',
      fontSize: 12,
    },
  },
  series: [
    {
      type: 'line',
      label: {
        formatter: '{a}\n{b}',
        rich: {
          a: {
            lineHeight: 10,
            height: 20,
          },
          b: {
            lineHeight: 10,
          },
        },
      },
      data: [
        { value: 10, label: 'line 1\ndesc 1' },
        { value: 20, label: 'line 2\ndesc 2' },
        { value: 30, label: 'line 3\ndesc 3' },
      ],
    },
  ],
};

效果如下：

[图片]

以上就是Echarts 折线图文本如何设置上下不同颜色？的详细内容，更多请关注www.sxiaw.com其它相关文章！