javascript - Google Visualization group()聚合函数返回null

我有一列名为someNumber的列，其中包含零和零。当将google.visualization.data.group应用于此列时，我无法获得零以进入表，只能获得null。
.min和.max的documentation表示将忽略空值，但我似乎只返回空值。

我怎样才能使零到达我的桌子？

谢谢高手!

工作示例:

// Load the Visualization API and the corechart package.
google.charts.load('current', {
  'packages': ['corechart', 'table', 'gauge', 'controls']
});

// Set a callback to run when the Google Visualization API is loaded.
google.charts.setOnLoadCallback(gChart0);

function gChart0() {
  drawChart();
};

function drawChart() {

  var result = [{
    "calendarWeek": "2017-W30",
    "clnCount": 1,
    "someNumber": null //NOTE THIS IS SET TO NULL
  }, {
    "calendarWeek": "2017-W30",
    "clnCount": 3,
    "someNumber": 0 //NOTE THIS IS SET TO ZERO
  }];

  //Create DataTable
  var data = new google.visualization.DataTable();
  data.addColumn('string', 'Calendar Week');
  data.addColumn('number', 'Count');
  data.addColumn('number', 'Some Number');

  var dataArray = [];
  $.each(result, function(i, obj) {
    dataArray.push([
      obj.calendarWeek,
      obj.clnCount,
      obj.someNumber
    ]);
  });
  data.addRows(dataArray);

  //grouping
  var groupView = google.visualization.data.group(data,
    [{
      column: 0,
      type: 'string'
    }],
    [{
        column: 1,
        aggregation: google.visualization.data.sum,
        type: 'number'
      },
      {
        column: 2,
        aggregation: google.visualization.data.min,
        type: 'number'
      }
    ]);

  //Options
  var options = {};

  // Instantiate and draw chart, passing in options.
  var chart = new google.visualization.Table(document.getElementById('chart_div'));
  chart.draw(groupView, options);

} //END  function drawChart()

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.1/jquery.min.js"></script>
<script src="https://www.gstatic.com/charts/loader.js"></script>

<div id="chart_div"></div>

最佳答案

您可以提供自己的自定义聚合功能。
聚合函数应接受值数组作为唯一参数。

在自定义求和函数中，我们将null替换为零

function customSum(values) {
  var sum = 0;
  values.forEach(function (value) {
    sum += value || 0;
  });
  return sum;
}

在自定义min函数中，当两个值均为Math.min时，null将返回零

function customMin(values) {
  var min = null;
  values.forEach(function (value) {
    min = Math.min(value, min);
  });
  return min;
}

请参阅以下工作片段...

google.charts.load('current', {
  'packages': ['corechart', 'table', 'gauge', 'controls']
});

// Set a callback to run when the Google Visualization API is loaded.
google.charts.setOnLoadCallback(gChart0);

function gChart0() {
  drawChart();
};

function drawChart() {

  var result = [{
    "calendarWeek": "2017-W30",
    "clnCount": 1,
    "someNumber": null //NOTE THIS IS SET TO NULL
  }, {
    "calendarWeek": "2017-W30",
    "clnCount": 3,
    "someNumber": 0 //NOTE THIS IS SET TO ZERO
  }];

  //Create DataTable
  var data = new google.visualization.DataTable();
  data.addColumn('string', 'Calendar Week');
  data.addColumn('number', 'Count');
  data.addColumn('number', 'Some Number');

  var dataArray = [];
  $.each(result, function(i, obj) {
    dataArray.push([
      obj.calendarWeek,
      obj.clnCount,
      obj.someNumber
    ]);
  });
  data.addRows(dataArray);

  //grouping
  var groupView = google.visualization.data.group(data,
    [{
      column: 0,
      type: 'string'
    }],
    [{
        column: 1,
        aggregation: customSum,
        type: 'number'
      },
      {
        column: 2,
        aggregation: customMin,
        type: 'number'
      }
    ]);

  function customSum(values) {
    var sum = 0;
    values.forEach(function (value) {
      sum += value || 0;
    });
    return sum;
  }

  function customMin(values) {
    var min = null;
    values.forEach(function (value) {
      min = Math.min(value, min);
    });
    return min;
  }

  //Options
  var options = {};

  // Instantiate and draw chart, passing in options.
  var chart = new google.visualization.Table(document.getElementById('chart_div'));
  chart.draw(groupView, options);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.1/jquery.min.js"></script>
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>