Javascript FLOT Combined Bar&折线图以x轴为字符串

时间:2015-03-28 08:11:45

标签: javascript flot

我有一个条形图,其中x轴是一个字符串,所以我需要使用一个ticks数组,我还需要能够指定每个条形的颜色,并在同一个图形中绘制一条线。 / p>

以下是我现在的代码,它已经通过许多改动尝试并使其工作,但我现在卡住了。

我根本无法显示图表,这里是jsfiddle:http://jsfiddle.net/9x7aJ/4102/

任何帮助都会受到赞赏,因为我今天花了大部分时间试图解决这个问题。

var fdat = [
 {
   "color": "#6ECFF6",
   "data": [[0,114]]
 },
 {
   "color": "#7BCDC8",
   "data": [[1,96]]
 },
 {
   "color": "#FDC68A",
   "data": [[2,94]]
 }
]

var data = [
    {label: "d1", data:fdat, bars: {show: true}},
    {label: "d2",data:fdat, lines: {show: true}, points:{show:true}}
];

var opts = {xaxis: {ticks:[[0,"Text 1"], [1,"Text 2"], [2,"Text 3"]]}};
$.plot($("#placeholder"),data,opts);

1 个答案:

答案 0 :(得分:1)

每个数据点不能有不同颜色的对象,数据点必须是简单数组。如果您将数据简化为

var fdat = [
    [0, 114],
    [1, 96],
    [2, 94]
]

图表有效(已更新fiddle) 如果每个条形需要不同的颜色,请为每个条形创建一个数据系列。