Weighted Average, JavaScript Programming Example of Weighted Average

Weighted Average, JavaScript Programming Example of Weighted Average

If you want to set a custom operation for displaying weighted average in Pivot, use the programming example below. Don't miss the opportunity to use our free coding samples to speed up the process of web development.

JS Code

webix.ui({
  id:"pivot",
  view:"pivot",
  datatable:{
    autowidth:true,
    autoheight:true
  },
  footer: true,
  structure: {
    rows: ["company","client"],
    columns: ["country"],
    values: [{ name:"statValue", operation:["wAver","avg"]}]
  }
});

$$("pivot").addOperation("avg", function(values, key, data, ids) {
  var sum = 0;
  for (i = 0; i < values.length; i++)
    sum+=values[i]*1;
  return values.length?(sum/values.length):0;
});

$$("pivot").addOperation("wAver", function(values, key, data, ids) {
  var i, sum = 0, weight, weightSum = 0;
  // calculate statSum and distanceSum for the leaves
  if(ids && ids.length){
    // get weighted sum for leave items
    for (i = 0; i < values.length; i++) {
      weight = $$("pivot").getItem(ids[i]).weight*1;
      sum += values[i]*weight;
      weightSum += weight;
    }
    // add calculated sum properties
    data[key+"$statSum"] = sum;
    data[key+"$weightSum"] = weightSum;
  }
  // calculation of branches
  if(data && data.data){
    for(i = 0; i < data.data.length; i++){
      var childItem = data.data[i];
      if(childItem[key+"$statSum"] && childItem[key+"$weightSum"] ){
        sum += parseFloat(childItem[key+"$statSum"]);
        weightSum += parseFloat(childItem[key+"$weightSum"]);
      }
      data[key+"$statSum"] = sum;
      data[key+"$weightSum"] = weightSum;
    }
  }
  // weighted average
  return weightSum?(sum/weightSum):0;
}, {ids: true});

$$("pivot").addTotalOperation("wAver", function(values, key, data) {
  var i, sum = 0, weightSum = 0;
  if(data && data.length){
    for(i = 0; i < data.length; i++){
      var item = data[i];
      if(item[key+"$statSum"] && item[key+"$weightSum"] ){
        sum += parseFloat(item[key+"$statSum"]);
        weightSum += parseFloat(item[key+"$weightSum"]);
      }
    }
  }
  // weighted average
  return weightSum?(sum/weightSum):0;
});

$$("pivot").parse(data);

HTML Code

<script>
var data = [
  {id: "1", client: "ACME", company: "A", country: "Germany", weight: 10, statValue:0.5},
  {id: "2", client: "ACME", company: "A", country: "Germany", weight: 20, statValue:0.4},
  {id: "3", client: "ACME", company: "B", country: "Germany", weight: 30, statValue:0.3},
  {id: "4", client: "ACME", company: "B", country: "Germany", weight: 40, statValue:0.5},
  {id: "5", client: "ACME", company: "A", country: "France", weight: 40, statValue:0.4},
  {id: "6", client: "ACME", company: "A", country: "France", weight: 10, statValue:0.6},
  {id: "7", client: "ACME", company: "B", country: "France", weight: 50, statValue:0.1},
  {id: "8", client: "ACME", company: "B", country: "France", weight: 30, statValue:0.5},
  {id: "9", client: "Samsung", company: "A", country: "Germany", weight: 20, statValue:0.7},
  {id: "10", client: "Samsung", company: "A", country: "Germany", weight: 30, statValue:0.4},
  {id: "11", client: "Samsung", company: "B", country: "Germany", weight: 10, statValue:0.3},
  {id: "12", client: "Samsung", company: "B", country: "Germany", weight: 50, statValue:0.5},
  {id: "13", client: "Samsung", company: "A", country: "France", weight: 70, statValue:0.8},
  {id: "14", client: "Samsung", company: "A", country: "France", weight: 50, statValue:0.4},
  {id: "15", client: "Samsung", company: "B", country: "France", weight: 50, statValue:0.3},
  {id: "16", client: "Samsung", company: "B", country: "France", weight: 30, statValue:0.5}
];
</script>