谷歌组合图中当前数据的平均线

Average line for current data in a Google ComboChart

本文关键字：数据 组合图 谷歌      更新时间：2023-09-26

大家好，伙计们目前正在使用组合图，并试图获取所有值的平均值，并在图表上显示一条线来表示每个代理的平均值。

我已经做了一些挖掘，我确实尝试使用了一种资源，但它抛出了错误，我一直在努力寻找解决方案。

下面是我的图表外观的 JSFiddle 示例，但我需要每个代理的所有值的平均线，并显示每个代理的平均线。

JSFiddle

下面是JS

小提琴的JS代码：

jQuery(function($) {
  google.charts.load('current', {
    callback: drawChartAverage,
    packages: ['corechart']
  });
  function drawChartAverage() {
    var result = [
      ['Agents', 'Minutes'],
      ['1', 44],
      ['2', 22],
      ['3', 11],
      ['4', 34]];
    var options = {
      title: 'Average Minutes cross Agents',
      vAxis: {
        title: 'Minutes'
      },
      hAxis: {
        title: 'Agent'
      },
      seriesType: 'bars',
      series: {
        1: {
          type: 'line'
        }
      }
    };
    var chartdata = new google.visualization.arrayToDataTable(result);
    var chartAvg = new google.visualization.ComboChart(document.getElementById('chartAvg'));
    chartAvg.draw(chartdata, options);
  }
})

我需要它看起来像我尝试使用的示例，但这样做并不快乐。

但是在让你知道我想做什么！

使用提供的示例...

google.charts.load('44', {
  callback: drawChartAverage,
  packages: ['corechart']
});
function drawChartAverage() {
  var result = [
    ['Agents', 'Minutes'],
    ['1', 44],
    ['2', 22],
    ['3', 11],
    ['4', 34]
  ];
  var chartdata = new google.visualization.arrayToDataTable(result);
  // Create a DataView that adds another column which is all the same (empty-string) to be able to aggregate on.
  var viewWithKey = new google.visualization.DataView(chartdata);
  viewWithKey.setColumns([0, 1, {
      type: 'string',
      label: '',
      calc: function (d, r) {
          return ''
      }
  }])
  // Aggregate the previous view to calculate the average. This table should be a single table that looks like:
  // [['', AVERAGE]], so you can get the Average with .getValue(0,1)
  var group = google.visualization.data.group(viewWithKey, [2], [{
      column: 1,
      id: 'avg',
      label: 'average',
      aggregation: google.visualization.data.avg,
      'type': 'number'
  }]);
  // Create a DataView where the third column is the average.
  var dv = new google.visualization.DataView(chartdata);
  dv.setColumns([0, 1, {
      type: 'number',
      label: 'average',
      calc: function (dt, row) {
          // round average up / down
          return Math.round(group.getValue(0, 1));
      }
  }]);
  var options = {
    title: 'Average Minutes cross Agents',
    vAxis: {
      title: 'Minutes'
    },
    hAxis: {
      title: 'Agent'
    },
    seriesType: 'bars',
    series: {
      1: {
        type: 'line'
      }
    }
  };
  var chartAvg = new google.visualization.ComboChart(document.getElementById('chartAvg'));
  chartAvg.draw(dv, options);
}
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chartAvg"></div>

相关文章：