javascript - Flot:在一张图表中组合堆叠条形图和折线图

Question

我正在尝试将堆积条形图和折线图组合到一个浮点图中。

我面临的问题是，行数据也会堆叠起来。这意味着第一个点 (line.data[0]) 的数据将绘制为 15 但我希望它是 5 .

请看这个jsfiddle:http://jsfiddle.net/derkinzi/eor5ngjd/

它在设置 stack: null 时有效，但我需要堆栈。同样给它自己的 yaxis 线并不能解决问题。 (将第 90 行更改为:yaxis: 2)

我怎样才能修改代码，使 line.data 得到它是用独立的 yaxis 独立绘图？

基本上我需要这个但是有堆积条:http://jsfiddle.net/derkinzi/eor5ngjd/11/

这是我的数据集:

var stack1 = {
    label: 'stack1',
    data: [
      [1, 6],
      [2, 3],
      [4, 5],
      [4, 3],
      [5, 4]
    ],
    bars: bar_options
  };
  var stack2 = {
    label: 'stack2',
    data: [
      [1, 4],
      [2, 4],
      [3, 4],
      [4, 4],
      [5, 4]
    ],
    bars: bar_options
  };
  var line = {
    label: 'line',
    data: [
      [1, 5],
      [2, 15],
      [3, 15],
      [4, 15],
      [5, 20]
    ],
    lines: line_options,
    yaxis: 1,
    points: {
      radius: 5,
      show: true
    },
  };
  var dataset = [stack1, stack2, line];

Answer 1

如 stack plugin 中所述，您可以为每个数据系列指定 stack 选项，因此在您的情况下执行此操作:

var stack1 = {
    //...
    stack: true,
};
var stack2 = {
    //...
    stack: true,
};
var line = {
    //...
    stack: false,
    //...
};

此外，当您定义多个轴时，请使用 yaxes 属性，而不是 yaxis。

Updated fiddle