Question

我想单独为每个flot条设置不同的渐变，但似乎它只接受数据对象中的纯色。

var data = [{data: [[0,1]], color: "red"},
            {data: [[1,2]], color: "yellow"},
            {data: [[2,3]], color: "green"}];

$.plot("#placeholder",data, {
    series: {
        bars: {
            show: true,
            barWidth: 0.3,
            align: "center",
            lineWidth: 0,
            fill:.75
        }
    },
    xaxis: {
        ticks: [[0,"Red"],[1,"Yellow"],[2,"Green"]]
    }
});

以下是jsfiddle

那么我怎么能弄清楚这一点呢？

Answer 1

在data对象中，用以下内容替换color: "..."：

bars: {
  fillColor: {
    colors: ["#ff0000", "#0000ff"]
  }
}

color属性主要用于条形图的轮廓（由于选项中的lineWidth: 0而无法绘制），并将用作{fillColor的后备广告。 1}}如果没有指定。

更新了小提琴：http://jsfiddle.net/TPp8m/487/

如何为每个条形图设置不同的渐变？

1 个答案: