javascript - 使用 for 循环后，我的所有柱形图都以单色绘制，我需要在 highcharts 中使用不同颜色的每个条形图

Question

$.getJSON("json/slide6_chart1.json", function(json) {
    var len = json.length;                              
    for(i=0;i<len; i++){                                      
            options.xAxis.categories = json[0]['data'];  
            j = i-1;                         
            options.series[j] = json[i];                    
            chart = new Highcharts.Chart(options);  
        };

Answer 1

也许您对循环中创建的所有图表使用相同的配置对象。

const colors = Highcharts.getOptions().colors
const option = {
  series: [{
    data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],
    type: 'column',
    color: colors[0]
  }]
}
const options = []
for (let i = 0; i < 4; ++i) {
  option.series[0].color = colors[i]
  options[i] = option
    //options[i] = JSON.parse(JSON.stringify(option)) // Clone object
}
for (let i = 0; i < 4; ++i) {
  Highcharts.chart('chart' + i, options[i])
}

实例: https://jsfiddle.net/q7x1Lecg/