Custom Full Row Aggregation : getGroupRowAgg : How can I specify aggregation logic for a list of columns

19 Views Asked by At

Can we have a generalized example for the documentation of getGroupRowAgg to implement the aggregation logic for all/a lost of columns - without hardcoding the column names like gold , silver etc. At the moment as I have a large number of columns and the column names can vary is there an elegant way to do this ?

let gridApi;

const gridOptions = {
  columnDefs: [
    { field: "country", rowGroup: true, hide: true },
    { field: "year", rowGroup: true, hide: true },
    { field: "gold" },
    { field: "silver" },
    { field: "bronze" },
    { headerName: "Gold*pi", field: "goldPi", minWidth: 200 },
    { headerName: "Silver*pi", field: "silverPi", minWidth: 200 },
    { headerName: "Bronze*pi", field: "bronzePi", minWidth: 200 },
  ],
  defaultColDef: {
    flex: 1,
    minWidth: 150,
    filter: true,
  },
  autoGroupColumnDef: {
    headerName: "Athlete",
    field: "athlete",
    minWidth: 250,
  },
  sideBar: true,
  getGroupRowAgg: getGroupRowAgg,
};

function getGroupRowAgg(params) {
  const result = {
    gold: 0,
    silver: 0,
    bronze: 0,
    goldPi: 0,
    silverPi: 0,
    bronzePi: 0,
  };

  params.nodes.forEach((node) => {
    const data = node.group ? node.aggData : node.data;

    if (typeof data.gold === "number") {
      result.gold += data.gold;
      result.goldPi += data.gold * Math.PI;
    }

    if (typeof data.silver === "number") {
      result.silver += data.silver;
      result.silverPi += data.silver * Math.PI;
    }

    if (typeof data.bronze === "number") {
      result.bronze += data.bronze;
      result.bronzePi += data.bronze * Math.PI;
    }
  });

  return result;
}

function expandAll() {
  gridApi.expandAll();
}

function collapseAll() {
  gridApi.collapseAll();
}

// setup the grid after the page has finished loading
document.addEventListener("DOMContentLoaded", () => {
  const gridDiv = document.querySelector("#myGrid");
  gridApi = agGrid.createGrid(gridDiv, gridOptions);

  fetch("https://www.ag-grid.com/example-assets/olympic-winners.json")
    .then((response) => response.json())
    .then((data) => gridApi.setGridOption("rowData", data));
});
0

There are 0 best solutions below