Question

我想增加4个不同变量的数量来填充饼图。但我只希望它增加2列中每个唯一变量的变量。我想尝试使它们分明但我不太明白如何。在if语句中，我尝试将值与字符串进行比较。这有效。在||之后我试图让它与众不同，但我遇到了麻烦。

这是我的代码：

        function createPiechartthree(){
        var columns = {};
        var xmlColumns = $j('head', xml);
        xmlColumns.find('headColumn').each(function(){

        var columnName = $j(this).find('columnValue').text();
        var columnID = $j(this).attr('columnid');
        columns[columnName] = (columnID);
    });

        var xmlData = $j('data', xml);

        xmlData.find('item').each(function(){
        $j(this).find('column').each(function(){
            var colID = $j(this).attr("columnid");


        console.log(colID);
            var value = $j(this).find('displayData').text();



        if(colID == columns["Risk level client"] || colID == columns["Counterparty name"] ){
            if(value === "High" || value === value){
                highRiskCategory++;
            }
            else if(value === "Medium" || value === value){
                mediumRiskCategory++;
            }
            else if(value === "Low" || value === value){
                lowRiskCategory++;
            } else if(value === "" || value === value) {
                unidentified++;
            }




        }
        })
    })

Answer 1

1）而不是手动递增计数，建立一个找到的值的数组......

var riskData = [
  ['Starbucks', 'High'],
  ['Starbucks', 'High'],
  ['McDonalds', 'Low'],
  ['Dunkin', 'Medium'],
  ['Dunkin', 'Medium'],
  ['Dunkin', 'Medium'],
  ['Subway', 'Low'],
  ['Chick-fil-a', ''],
  ['Chick-fil-a', '']
];

2）然后过滤掉重复的内容......

var pieData = new google.visualization.DataTable();
pieData.addColumn('string', 'Risk Level');

var counterParty = [];
riskData.forEach(function (riskLevel) {
  if (counterParty.indexOf(riskLevel[0]) === -1) {
    counterParty.push(riskLevel[0]);
    var rowData = (riskLevel[1] === '') ? ['Unidentified'] : [riskLevel[1]];
    pieData.addRow(rowData);
  }
});

3）然后使用谷歌的group方法汇总计数......

var groupPie = google.visualization.data.group(
  pieData,
  [0],
  [{
    aggregation: google.visualization.data.count,
    column: 0,
    label: 'Count',
    type: 'number'
  }]
);

请参阅以下工作代码段...

＆＃13;

google.charts.load('current', {
  callback: drawChart,
  packages: ['controls']
});

function drawChart() {
  // create array like this
  var riskData = [
    ['Starbucks', 'High'],
    ['Starbucks', 'High'],
    ['McDonalds', 'Low'],
    ['Dunkin', 'Medium'],
    ['Dunkin', 'Medium'],
    ['Dunkin', 'Medium'],
    ['Subway', 'Low'],
    ['Chick-fil-a', ''],
    ['Chick-fil-a', '']
  ];

  // for example only <--
  var tableRisk = new google.visualization.ChartWrapper({
    chartType: 'Table',
    containerId: 'table_risk',
    dataTable: google.visualization.arrayToDataTable(riskData, true)
  });
  tableRisk.draw();
  // -->

  var pieData = new google.visualization.DataTable();
  pieData.addColumn('string', 'Risk Level');

  var counterParty = [];
  riskData.forEach(function (riskLevel) {
    if (counterParty.indexOf(riskLevel[0]) === -1) {
      counterParty.push(riskLevel[0]);
      var rowData = (riskLevel[1] === '') ? ['Unidentified'] : [riskLevel[1]];
      pieData.addRow(rowData);
    }
  });

  // for example only <--
  var tablePie = new google.visualization.ChartWrapper({
    chartType: 'Table',
    containerId: 'table_pie',
    dataTable: pieData
  });
  tablePie.draw();
  // -->

  var groupPie = google.visualization.data.group(
    pieData,
    [0],
    [{
      aggregation: google.visualization.data.count,
      column: 0,
      label: 'Count',
      type: 'number'
    }]
  );

  // for example only <--
  var tablePie = new google.visualization.ChartWrapper({
    chartType: 'Table',
    containerId: 'table_group',
    dataTable: groupPie
  });
  tablePie.draw();
  // -->

  var chartPie = new google.visualization.ChartWrapper({
    chartType: 'PieChart',
    containerId: 'chart_pie',
    dataTable: groupPie,
    options: {
      colors: ['red', 'orange', 'green', 'blue']
    }
  });
  chartPie.draw();
}

＆＃13;

div {
  display: inline-block;
  margin-right: 8px;
  vertical-align: top;
}

＆＃13;

<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="table_risk"></div>
<div id="table_pie"></div>
<div id="table_group"></div>
<div id="chart_pie"></div>

＆＃13;

使2列不同

1 个答案: