独特的颜色为flot条形图

时间:2013-07-27 18:29:17

标签: javascript jquery graph flot bar-chart

我想创建一个显示真假数字的flot条形图,如下面的示例所示。 我希望真正的酒吧是绿色的,而假的酒吧是红色的。我尝试过使用colors数组,但它无法正常工作。

我目前的代码:

var options3 = {grid: {hoverable: true},series: {bars: {show: true,barWidth: 0.6,align: "center"}},yaxis: {min:0,tickSize: 1},xaxis: {mode: "categories",ticks: [ [0, 'True'], [1, 'False'] ],tickLength: 0},tooltip: true,tooltipOpts: {content: '%y Votes', defaultTheme: false}, colors: [ "#FF0000", "#00FF00"]};
var data3 = [ [0, 3], [1, 9] ];
$(document).ready(function() {
    $.plot('#graph3', [data3], options3);
});

示例:http://joshblease.co.uk/Maths/Admin/chart.php#graph3

1 个答案:

答案 0 :(得分:2)

问题是您只有一个数据系列,它被分配了数组中的第一种颜色(红色)。如果替换

,您将获得所需的结果
var data3 = [ [0, 3], [1, 9] ];

var data3 = [
    [[0, 3]],
    [[1, 9]]
];

然后在图中使用data3而不是[data3]。请参阅jsFiddle