flot js stacked bar chart

Question

Im trying to put stacked bar chart, it works fine if there is only bar chart.

var dataset = [{
        label: "orders",
        data: [[0,215],[1,13],[2,23],[3,48],[4,68],[5,22],[6,1],[7,3],[8,13],[9,40],[10,1]],
        color: "#1ab394",
        yaxis: 2,
        bars: {
            show: true,
            align: "center",
            barWidth: 0.8,
            lineWidth: 0
        },
        stack: true
      },
        {
        label: 'baz', 
        data: [[1,100], [2,200], [3,300], [4,400], [5,500]],
        bars: {
            show: true,
            align: "center",
            barWidth: 0.8,
            lineWidth: 0
        },
        stack: true
    }
    ];

Fiddle link : stacked bar chart...

stacking fails if I add line chart with it

      {
        label: "Test",
        data: [[0,2430.91],[1,252.12],[2,659.24],[3,2545.83],[4,4996.56],[5,463.00],[6,0.01],[7,45.68],[8,1359.73],[9,217.53],[10,43.73]],
        color: "#0EBFE9",
        lines: {
            show: true,
            fill: false
        },
        stack: null

Fiddle link : stacked bar chart with line chart. Can anyone help me to do this.

Raidri Raidri · Accepted Answer · 2018-08-20T08:58:21

Even your first example seems incorrect. It doesn't really make sense to stack bars on different y-axes.

Put both bar charts on the same y-axis (with yaxis: 2) and all works fine (see updated fiddle).

flot js stacked bar chart

1 Answers