不同的酒吧的不同的颜色酒吧在一个flot长条图

Question

我想为flot条形图中的所有条形保留不同的颜色。是否有可能做到这一点？我找到了一种方法来做到这一点，如果我在每个条形的变量中传递颜色，现在使用数据我也在变量d1_1，d1_2，d1_3，d1_4，d1_5，d1_6，d1_7中传递颜色并传入变量数据 我正在编写下面提到的代码，但它没有用，请建议我如何做到这一点 我的代码如下所述。

// Colors 
var color01 = '#0000FF'; //blue 
var color02 = '#FF0000'; //red
var color03 = '#32CD32'; //lime green

var d1_1 = [[{title[0], data[0], color: color01}],[{title[1],  data[1], 
color: color01}],[{title[2],  data[2], color: color01}],[{title[3],  
data[3], color: color01}],[{title[4],  data[4], color: color01}],[{title[5],  
data[5], color: color01}]];
var d1_2 = [{[title[0], data[6]], color: color02},{[title[1],  data[7]], 
color: color02},{[title[2],  data[8]], color: color02},{[title[3],  
data[9]], color: color02},{[title[4],  data[10]], color: color02},
{[title[5], data[11]], color: color02}];
var d1_3 = [{[title[0], data[12]], color: color03},{[title[1], data[13]], 
color: color03},{[title[2], data[14]], color: color03},{[title[3], 
data[15]], color: color02},{[title[4], data[16]], color: color02},
{[title[5], data[17]], color: color03}];
var d1_4 = [{[title[0], data[18]], color: color02},{[title[1], data[19]], 
color: color02},{[title[2], data[20]], color: color02},{[title[3], 
data[21]], color: color03},{[title[4], data[22]], color: color02},
{[title[5], data[23]], color: color02}];
var d1_5 = [{[title[0], data[24]], color: color02},{[title[1], data[25]], 
color: color02},{[title[2], data[26]], color: color02},{[title[3], 
data[27]], color: color03},{[title[4], data[28]], color: color02},
{[title[5], data[29]], color: color02}];
var d1_6 = [{[title[0], data[30]], color: color02},{[title[1], data[31]], 
color: color02},{[title[2], data[32]], color: color02},{[title[3], 
data[33]], color: color03},{[title[4], data[34]], color: color02},
{[title[5], data[35]], color: color02}];
var d1_7 = [{[title[0], data[36]], color: color02},{[title[1], data[37]], 
color: color02},{[title[2], data[38]], color: color02},{[title[3], 
data[39]], 
color: color02},{[title[4], data[40]], color: color03},{[title[5], 
data[41]], 
color: color02}];

var data1 = [
{
    label: xaxis[0],
    data: d1_1,
    valueLabels: { show: true, verticalText: true },
        bars: {
            showValues: true,
            show: true,
            barWidth: 0.13,
            fill: true,
            lineWidth: 0,
            order: 0,
            //fillColor: "#0000FF",
            fillColor: { colors: [ { opacity: 0.3 }, { opacity: 0.8 } ] }
        },
        //color: "#ffffff"
        color: "#0000FF"
    },
{
    label: xaxis[1],
    data: d1_2,
    bars: {
            showValues: true,
            show: true,
            barWidth: 0.13,
            fill: true,
            lineWidth: 0,
            order: 1,
            //fillColor: "#6495ED",
            fillColor: { colors: [ { opacity: 0.3 }, { opacity: 0.8 } ] }
        },
        valueLabels: { show: true, verticalText: true },
        //color: "#ffffff"
        color: "#6495ED"
    },
    {
    label: xaxis[2],
    data: d1_3,
    bars: {
            showValues: true,
            show: true,
            barWidth: 0.13,
            fill: true,
            lineWidth: 0,
            order: 2,
            //fillColor: "#90EE90",
            fillColor: { colors: [ { opacity: 0.3 }, { opacity: 0.8 } ] }
        },
        valueLabels: { show: true, verticalText: true },
        //color: "#ffffff"
        color: "#90EE90"
    },
    {
    label: xaxis[3],
    data: d1_4,
  bars: {
            showValues: true,
            show: true,
            barWidth: 0.13,
            fill: true,
            lineWidth: 0,
            order: 3,
            //fillColor: "#FF0000",
            fillColor: { colors: [ { opacity: 0.3 }, { opacity: 0.8 } ] }
        },
        valueLabels: { show: true, verticalText: true },
        //color: "#ffffff"
        color: "#FF0000"
    },
    {
    label: xaxis[4],
    data: d1_5,
   bars: {
            showValues: true,
            show: true,
            barWidth: 0.13,
            fill: true,
            lineWidth: 0,
            order: 4,
            fillColor: "#f4b183",
            fillColor: { colors: [ { opacity: 0.3 }, { opacity: 0.8 } ] }
        },
        valueLabels: { show: true, verticalText: true },
        //color: "#ffffff"
        color: "green"
    },
    {
    label: xaxis[5],
    data: d1_6,
   bars: {
            showValues: true,
            show: true,
            barWidth: 0.13,
            fill: true,
            lineWidth: 0,
            order: 5,
            //fillColor: "yellow",
            fillColor: { colors: [ { opacity: 0.3 }, { opacity: 0.8 } ] }
        },
        valueLabels: { show: true, verticalText: true },
        //color: "#ffffff"
        color: "yellow"
    },
     {
    label: xaxis[6],
    data: d1_7,
   bars: {
            showValues: true,
            show: true,
            barWidth: 0.13,
            fill: true,
            lineWidth: 0,
            order: 6,
            //fillColor: "silver",
            fillColor: { colors: [ { opacity: 0.3 }, { opacity: 0.8 } ] }
        },
        valueLabels: { show: true, verticalText: true },
        //color: "#ffffff"
        color: "silver"
    }
,
    {
        label: "test"
    }

    ];

var t1 = [];
    for (var i = 0; i < tik.length; i += 1)
        t1.push([i+1, tik[i]]);

function plot_bar_chart(data1){
p = $.plot("#placeholder", data1, {
    xaxis: {
        min: 0,
        max: 6,
        mode: "categories",
        categories: { "PA_IN PROGRESS": 0.5, "PA_IN PROGRESS OPUS": 1.5, "PA_IN PROGRESS MICROWAVE": 2.5, "PA_COMPLETED": 3.5, "PA_CANCELLED": 4.5, "PA_TERMINATION ABNORMALLY": 5.5 },
        tickLength: 0,
        axisLabelUseCanvas: true,
        alignTicksWithAxis: true,
        font:{
            size:12,
            weight:"bold",
            family:"sans-serif",
            variant:"small-caps",
            color: "#000000"
        }
    },
    yaxis: {
        axisLabel: 'Number of Projects',
        axisLabelUseCanvas: true,
        axisLabelFontSizePixels: 30,
        axisLabelFontFamily: 'Verdana, Arial, Helvetica, Tahoma, sans-serif',
        axisLabelPadding: 5
    },
    grid: {
        hoverable: true,
        clickable: false,
        borderWidth: 1
    },
    legend: {
        labelBoxBorderColor: "none",
        position: "right"
    },
    series: {
        shadowSize: 1,
    },
});