echarts设置不同颜色数据项,并且文字也要不同颜色

要设置不同颜色的数据项和文字颜色，可以使用 ECharts 提供的 visualMap 组件和 textStyle 属性。

首先，使用 visualMap 组件来设置数据项不同的颜色。例如，在柱状图中，可以这样设置：

option = {
  // ...
  visualMap: {
    type: 'piecewise', // 分段型 visualMap
    pieces: [
      { value: 0, color: '#FF6E76' }, // 第一段数据项颜色
      { value: 50, color: '#FFD45B' }, // 第二段数据项颜色
      { value: 100, color: '#5AB1EF' } // 第三段数据项颜色
    ]
  },
  series: [
    {
      name: '销量',
      type: 'bar',
      data: [20, 60, 80],
      // ...
    }
  ]
}

接下来，使用 textStyle 属性来设置文字颜色。例如，在柱状图中，可以这样设置：

option = {
  // ...
  series: [
    {
      name: '销量',
      type: 'bar',
      data: [20, 60, 80],
      label: {
        show: true,
        position: 'top',
        textStyle: {
          color: function(params) {
            // 根据数值设置文字颜色
            if (params.value < 30) {
              return '#FF6E76'; // 第一段文字颜色
            } else if (params.value < 70) {
              return '#FFD45B'; // 第二段文字颜色
            } else {
              return '#5AB1EF'; // 第三段文字颜色
            }
          }
        }
      }
    }
  ]
}

以上代码中，label 属性用于设置柱状图的标签，通过 textStyle.color 属性设置文字颜色。在 color 属性中，我们可以使用函数来根据数值设置不同的颜色。

注意：以上代码仅供参考，具体使用时需要根据实际情况进行调整。