PivotTable.js的总计怎么改写

Question

就是象下面的表,有多少列是不知的,损耗率 在后台已经由 损耗数/投入 算出来了,但是对应的Totals就是不对的,比如冷镦的 Totals损耗率应该是=505.80/1,214.20得来,而不是这列总计来的.

要怎么样修改代码实现?
initGird: function (param) {

 var derivers = $.pivotUtilities.derivers;

 var renderers = $.extend(
     $.pivotUtilities.renderers,
     $.pivotUtilities.plotly_renderers,
     $.pivotUtilities.d3_renderers,
     $.pivotUtilities.export_renderers
     
 );
  param = param || {};

 param.startTime = startTime;
 param.endTime = endTime;

 param.ProductId = ProductId;
     
 


 $.ajax({
     url: '../../MasterData/Workbin/GetLossList',
   
     data: { queryJson: JSON.stringify(param) },
     dataType: "json",
     timeout: 900000,
     success: function (data) {

         if (data.code == 200) {

             var arraycol = new Array();
             arraycol[0] = "工序";
            
             arraycol[1] = "项目";
             var arrayrow = new Array();
             arrayrow[0] = "工单";

             var arraysum = new Array();
           
             arraysum[0] = "数量";
             $("#output").pivotUI(data.data, {
                 renderers: renderers,
                                       
               
                 sorters: {

                     "工序": $.pivotUtilities.sortAs(["冷镦", "抛光委外", "研磨/除油", "二次冲压", "清洗",
                         "钝化", "清洗/烘干", "全检", "包装"]),
                     项目: $.pivotUtilities.sortAs(
                         ["投入", "产出",
                             "损耗数", "损耗率"])
                 },
                
                
                 cols: arraycol, rows: arrayrow,

                 "showUI":false,

                 "vals": arraysum,
                 "aggregatorName": "Sum",
                 rendererName: "Table"
             }, true)





         }
     },
     error: function (e) {
         console.log(e);
     }
 });

},

Answer 1

引自免费微信小程序：皆我百晓生

要实现您描述的功能，我们可以将数据分为两部分：第一部分是总金额，第二部分是每行的比率（即每一项的产出与投入之比）。在您的示例代码中，第一部分已经正确实现了总金额的计算。

为了计算每行的比率，我们需要对每一行的数据进行处理。这里是一个可能的实现方式：

function calculateRatio(rowData) {
    const totalAmount = parseFloat(rowData[0]);
    const outputAmount = parseFloat(rowData[1]);
    const inputAmount = parseFloat(rowData[2]);

    return (inputAmount / totalAmount);
}

// 使用此函数更新表格中的比率
var arraysum = [];
arraysum[0] = "比率";

for (let i = 1; i < rowData.length; i++) {
    arraysum[i] = calculateRatio([rowData[i]]);
}

然后，我们将这些比率添加到原始数组arraysum中，并将其传递给pivotUI方法。

接下来，我们只需稍微修改一下renderers对象中的"vals"属性，以便显示每个值的百分比。您可以这样做：

renderers["vals"] = {
    name: "Percent",
    formula: "percent",
    format: "%",
    formatter: function(value, row) {
        if (value === undefined || value === null) {
            return "";
        }

        // 计算当前行的比率并转换为百分比
        const ratio = calculateRatio([rowData[row]], 0);

        return `${ratio * 100}%`;
    }
};

这将返回每个值的百分比表示。注意，这个示例假设每一行都有一个名为"dataRow"的字段。如果您没有这样的字段，您可能需要根据实际情况调整这个函数。

最后，您需要将新的renderers设置回pivotUI对象，就像之前那样调用它。

完整的代码如下：

$(document).ready(function () {
  success: function (data) {
    if (data.code == 200) {
      var arraycol = new Array();
      arraycol[0] = "工序";
      arraycol[1] = "项目";
      var arrayrow = new Array();
      arrayrow[0] = "工单";
      var arraysum = new Array();

      arraysum[0] = "数量";

      $("#output").pivotUI(data.data, {
        renderers: {
          "cols": arraycol,
          "rows": arrayrow,
          "vals": arraysum,
          "rendererName": "Table"
        },

        sorters: {
          "项目": $.pivotUtilities.sortAs(["投入", "产出", "损耗数", "损耗率"])
        },
        
        cols: arraycol, rows: arrayrow,
        vals: arraysum,
        aggregatorName: "Sum",
        rendererName: "Table",

        renderers: {
          "vals": {
            name: "Percent",
            formula: "percent",
            format: "%",
            formatter: function (value, row) {
              if (value === undefined || value === null) {
                return "";
              }

              // 计算当前行的比率并转换为百分比
              const ratio = calculateRatio([rowData[row]], 0);

              return `${ratio * 100}%`;
            }
          }
        }
      });
    }
  }
});

这个例子展示了如何计算每一行的比率，并将其添加到表格中。请注意，这个示例假设每一行都有一个名为"dataRow"的字段。如果您没有这样的字段，您可能需要根据实际情况调整这个函数。