likes
comments
collection

echarts给柱状图的每个柱子配置不同的颜色

作者站长头像
站长
· 阅读数 0

series数组对象中与datatype同级的写一个itemStyle的对象,对象中是normal对象,normal对象中有一个color键,其值是对应的是一个函数,其中this.pieColor是我自己定义的颜色数组,类似于:

[
  "#FFDB5C",
  "#37A2DA",
  "#fb7293",
  "#67E0E3"
]

然后函数的参数params中有一个dataIndex属性,将其返回即可使用,如下边代码所示:

series: [
  {
    type: "bar",
    data: dataX,
    itemStyle: {
      normal: {
        color: (params) => this.pieColor[params.dataIndex],
      },
    },
  },
],