如何强制设置ECharts树形图（Treemap）系列的颜色

我花了近2小时才搞定这个设置，特意分享给所有需要的人！

核心配置要点 #

• 强制指定颜色的配置需添加在levels中，绝对不能放在itemStyle内！
• 通过color数组定义自定义颜色集合，搭配colorMappingBy: 'value'让颜色根据数值映射。

关键配置片段：

levels: {
  color: ["#eba080","#2d2554","#40522a","#9f1f1f","#a48679","#542261"],
  colorMappingBy: 'value'
}

完整示例代码 #

echarts.init($('.treemap')[0]).setOption({
  series: [{
    type: 'treemap',
    breadcrumb: {show: false, top: '92%'},
    top: 30,
    levels: [{
      color: ["#eba080","#2d2554","#40522a","#9f1f1f","#a48679","#542261"],
      colorMappingBy: 'value',
      itemStyle: {borderColor: '#222', borderWidth: 0, gapWidth: 1},
      upperLabel: {show: false}
    }],
    data: data
  }]
});

希望我的分享能帮大家节省时间！

内容的提问来源于stack exchange，提问作者JK2030