面积图

面积图是用背景颜色填充折线与坐标轴之间的空间,通过面积的大小来表示数据。与普通折线图相比,面积图具有更直观的视觉效果。它特别适合用于系列较少的场景。

option = {
  xAxis: {
    data: ['A', 'B', 'C', 'D', 'E']
  },
  yAxis: {},
  series: [
    {
      data: [10, 22, 28, 23, 19],
      type: 'line',
      areaStyle: {}
    },
    {
      data: [25, 14, 23, 35, 10],
      type: 'line',
      areaStyle: {
        color: '#ff0',
        opacity: 0.5
      }
    }
  ]
};
在线示例

如果你想改变折线图的面积样式,可以尝试使用 areaStyle。将 'areaStyle' 设置为 {} 即可使用默认类型:使用系列的颜色来半透明地填充面积。如果你想改变样式,可以尝试覆盖 'areaStyle' 中的配置项。例如,将第二个系列的颜色更改为不透明度为 50% 的黄色。

贡献者 在 GitHub 上编辑此页

pissang pissang