0

我正在尝试创建一个columnchartusing highcharts. 目的是将系列中的 2 个堆叠在一起,将第三个放在它们旁边。

我的示例 CSV 文件如下所示:

Datoer,01/2013,02/2013,03/2013,04/2013
Disk - Freespace,800,1000,1243,1387
Disk - Allokeret,1000,1200,1456,1689
Tape Forbrug,5241,5942,6752,7210

代码如下所示:

$(document)
  .ready(function () {


  var graph = {
    chart: {
      renderTo: 'container',
      type: 'column'
    },
    credits: {
      enabled: false
    },
    title: {
      text: 'Imaginært Diskforbrug'
    },
    xAxis: {
      categories: []
    },
    yAxis: {
      min: 0,
      title: {
        text: 'Gigabyte'
      },
      stackLabels: {
        enabled: true,
        style: {
          fontWeight: 'bold',
          color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
        }
      }
    },
    legend: {
      align: 'right',
      x: -100,
      verticalAlign: 'top',
      y: 20,
      floating: true,
      backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColorSolid) || 'white',
      borderColor: '#CCC',
      borderWidth: 1,
      shadow: false
    },
    plotOptions: {
      column: {
        stacking: 'normal',
        dataLabels: {
          enabled: true,
          color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white'
        }
      }
    },
    series: []
  };

  $.get('data.txt', function (data) {
    // Split the lines
    var lines = data.split('\n');
    $.each(lines, function (lineNo, line) {
      var items = line.split(',');

      // header line containes categories
      if(lineNo == 0) {
        $.each(items, function (itemNo, item) {
          if(itemNo > 0) graph.xAxis.categories.push(item);
        });
      }

      // the rest of the lines contain data with their name in the first position
      else {
        var series = {
          data: []

        };
        $.each(items, function (itemNo, item) {
          if(itemNo == 0) {
            series.name = item;
          } else {
            series.data.push(parseFloat(item));
          }
        });

        graph.series.push(series);
      }

    });

    var chart = new Highcharts.Chart(graph);
  });


});

我的问题是我似乎无法弄清楚如何区分哪些系列是堆叠的,哪些不是。我希望 CSV 文件中的第四行不与其他 2 行(文件中的编号 2 和 3)堆叠,而是出现在它们旁边。

似乎我定义列是否堆叠的唯一选择是在 中plotOptions,但这让我别无选择来分离系列的堆叠。

4

2 回答 2

0

我建议熟悉预处理 CSV 数据 http://docs.highcharts.com/#preprocessing

于 2013-03-12T11:54:23.527 回答
0

这是,你在找什么?

http://api.highcharts.com/highcharts#series.stack

jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/series/stack/
于 2013-03-09T13:49:46.287 回答