Flot: Stacked bar labels overlapping / not showing

问题

Here's my JSFiddle.

The issue is that the stacked bars overlap / doesn't show all distinct labels stacked sometimes (see third bar in first chart).
Not sure but, the issue is maybe due to the fact that the series is not the same length and it doesn't contain 0 if no data for a label, like in the second example in the JSFiddle?

Q: How can I make the bar labels not overlap?

var newData = [];
  var newLabels = [];
  var newTicks = [];

  for (var i = 0; i < dataFromServer.length; i++) {
    var datapoint = dataFromServer[i];

    var tick = newTicks.indexOf(datapoint.name);
    if (tick == -1) {
      tick = newTicks.length;
      newTicks.push(datapoint.name);
    }

    var index = newLabels.indexOf(datapoint.label);
    if (index == -1) {
      index = newLabels.length;
      newLabels.push(datapoint.label);

      newDataPoint = {
        label: datapoint.label,
        data: []
      };
      newDataPoint.data[tick] = [tick, datapoint.countInbound];
      newData.push(newDataPoint);
    } else {
      newData[index].data[tick] = [tick, datapoint.countInbound];
    }
  }
  for (var i = 0; i < newTicks.length; i++) {
    newTicks[i] = [i, newTicks[i]];
  }
  newLabels = null;

  var newOptions = {
    xaxis: {
      ticks: newTicks
    },
    grid: {
      clickable: true,
      hoverable: true
    },
    series: {
      stack: true,
      bars: {
        show: true,
        align: 'center',
        barWidth: 0.5
      }
    }
  };
  $.plot($("#placeholder2"), newData, newOptions);

回答1:

To determine where a stacked bar starts, Flot has to sum up the height of the bars below it. If there are empty bars below (with no height) the sum can not be calculated. This leads to later bars again starting at zero.

To counter this insert the missing bars with a height of zero:

for (var i = 0; i < newData.length; i++) {
    for (var j = 0; j < newTicks.length; j++) {
        if (newData[i].data[j] === undefined) {
            newData[i].data[j] = [j, 0];
        }
    }
}

See this updated fiddle.

来源：https://stackoverflow.com/questions/34160791/flot-stacked-bar-labels-overlapping-not-showing