Jqplot派/圆环图系列颜色数组不能重用/重复

Question

我正在使用jqplot绘制饼图和圆环图。 ，我使用的 'seriesColors'，得到定制颜色切片http://www.jqplot.com/docs/files/jqplot-core-js.html#jqPlot.seriesColors

seriesColors：[ “0571B0”， “＃5E3C99”， “＃008837”]

如果数据（数组值来通过）只有三个值，那么它会正确显示颜色。 但是，如果有超过3个值，它只会以黑色显示该切片。 它不会重复/重新使用颜色（如文档中所述）。

这就是：

var s2 = [['a', 8], ['b', 12], ['c', 6]]; 
var plot1 = $.jqplot('div_1', [s2], { 
       title: 'Chart 1', 

       seriesDefaults:{ 
        renderer:$.jqplot.DonutRenderer , 
        rendererOptions:{ 
         startAngle: -90, 
         innerDiameter: 100, 
         showDataLabels: true, 
         dataLabels:'percent' 
        } 
        }, 
        seriesColors: ["#0571B0", "#5E3C99", "#008837"], 
        highlighter: { 
         show: true 
        }, 
        legend: { show:true, rendererOptions: {numberRows: 1}, location: 's', placement: 'outsideGrid'} 
       }); 

但是，如果我在阵列中添加第4个值，颜色都不要再用。如果我修改上面的阵列

var s2 = [['a', 8], ['b', 12], ['c', 6], ['d', 9]]; 

然后，第四切片（“d”） 即显示为黑色的颜色。

我该如何解决这个问题？

Answer 1

找到了解决办法。 希望这可以帮助那些面临类似问题的人。

这是代码。

var dataValues = [['a', 8], ['b', 12], ['c', 6], ['d', 9], ['e', 14]]; 

//Define the seriesColors array.. 
var seriesColors = ["#0571B0", "#5E3C99", "#008837"]; 

var seriesColorsLength = seriesColors.length; 
var donutChartSeriesColors = new Array(); 

//Prepare a new array which would be passe to the chart.. 
//This will handle even if there are more value than the seriesColors array.. 
for(var i = 0; i < dataValues.length; i++) { 
donutChartSeriesColors[i] = seriesColors[(seriesColorsLength-1) % i]; 
} 

var plot1 = $.jqplot('div_1', [dataValues ], { 
      title: 'Chart 1', 

      seriesDefaults:{ 
       renderer:$.jqplot.DonutRenderer , 
       rendererOptions:{ 
        startAngle: -90, 
        innerDiameter: 100, 
        showDataLabels: true, 
        dataLabels:'percent' 
       } 
       }, 
       seriesColors: donutChartSeries, 
       highlighter: { 
        show: true 
       } 
});