Flot:堆叠条形标签重叠/不显示

时间:2015-12-08 16:17:36

标签: javascript arrays json flot

这是我的JSFiddle

问题在于堆叠的条重叠/有时不会显示所有不同的标签(请参见第一个图表中的第三个条)。
不确定但问题可能是由于系列是不相同的长度,如果没有标签的数据,它不包含0,如JSFiddle的第二个例子?

问:如何使条形标签不重叠?

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 个答案:

答案 0 :(得分:1)

要确定堆积条的开始位置,Flot必须总结其下方条形的高度。如果下方有空栏(没有高度),则无法计算总和。这导致后来的酒吧再次从零开始。

要对此进行计数,请插入高度为零的缺失条:

   SaveFileDialog my_Sfd1 = new SaveFileDialog();
        my_Sfd1.Filter = "All files (*.*)|*.*";    //here you can specify the file format.(*.*)indicates all files.
        my_Sfd1.Title = "Save file to";   //Title to display at top of the dialog box
        my_Sfd1.FilterIndex = 2;
        my_Sfd1.RestoreDirectory = true;
        if (DialogResult.OK == (new Invoker(my_Sfd1).Invoke()))
        {
                //add file here which you want to save.
        }

请参阅此更新fiddle