如何用单行代码修改饼图6个扇区的填充颜色？

嘿，刚好碰到过类似的问题！你之前尝试单个设置.fillColor报错，大概率是因为没遍历每个数据点，而且其实大部分主流图表库都提供了全局颜色数组属性，能一次性给所有扇区分配颜色，不用逐个修改。

下面给你两个常用图表库的单行实现方案：

1. 如果你用的是Chart.js #

直接在数据集里传入backgroundColor颜色数组，一行代码就能搞定6个扇区的颜色配置：

new Chart(document.getElementById('your-chart-id'), { type: 'pie', data: { labels: ['扇区1','扇区2','扇区3','扇区4','扇区5','扇区6'], datasets: [{ data: [10,20,15,25,5,25], backgroundColor: ['#e74c3c', '#2ecc71', '#3498db', '#f1c40f', '#9b59b6', '#1abc9c'] }] } });

2. 如果你用的是Highcharts #

通过全局的colors属性设置，图表会自动按顺序给每个扇区匹配颜色：

Highcharts.chart('your-chart-container', { chart: { type: 'pie' }, colors: ['#e74c3c', '#2ecc71', '#3498db', '#f1c40f', '#9b59b6', '#1abc9c'], series: [{ data: [['扇区1',10],['扇区2',20],['扇区3',15],['扇区4',25],['扇区5',5],['扇区6',25]] }] });

关键提醒： #

• 颜色数组的长度要和你的扇区数量（6个）完全对应，每个元素对应一个扇区的颜色，支持十六进制、RGB/RGBA、甚至直接用颜色名称（比如'red'）。
• 用这个全局属性就不用再逐个设置单个扇区的.fillColor了，它会自动覆盖默认配色，一次性完成所有扇区的颜色修改。

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