EJ2 Pivot Table - Floating Point math issue in grand totals

Question

As the subject states, we recently had issues where the grand total was summing .1 and .2 which caused the grand total to become over 10 characters in length and be truncated. Can decimal.js be implemented or how do prevent the JS issue in those columns totals?

Mouli Eswararao · Answer

Hi Mark, 
 
Greetings from Syncfusion support. 
 
We can set decimal points to a value by using number formatting feature. We can set number decimal values to be displayed for the value field in formatSettings by setting format. We have prepared a sample for please find it for your reference.  
 
Sample: https://stackblitz.com/edit/3yjatc  
 
Code: 




dataSourceSettings: { 
    enableSorting: true, 
    columns: [{ name: 'Year' }, { name: 'Quarter' }], 
    values: [ 
      { name: 'Sold', caption: 'Units Sold' }, 
      { name: 'Amount', caption: 'Sold Amount', type: 'Avg' } 
    ], 
    dataSource: getPivotData(), 
    rows: [{ name: 'Country' }, { name: 'Products' }], 
// set format here 
    formatSettings: [{ name: 'Amount', format: 'N2' }], 
    expandAll: false, 
    filters: [] 
  }, 

 
Please let us know if you have any other queries, we are happy to assist you. 
 
Regards,Mouli

Mark · Answer

So this worked, but is there a way to do conditional formatting based on the column data? Specifically, I have some that should be integers, some are currency, some are float. I just have the following (Type will return with: Payments, Quantity, Percentage):

columns: [{ name: 'pivot_type', caption: 'Type' }],
                    rows: [{ name: 'pivot_location', caption: 'Location' }],
                    values: [{ name: 'pivot_total', caption: 'Total' }],

Manikandan Murugesan · Answer

Hi Mark, 

Kindly refer to the following code example to format the value fields. 

Code Example: 




this.dataSourceSettings = { 
    dataSource: Pivot_Data, 
    expandAll: false, 
    enableSorting: true, 
    formatSettings: [{ name: 'Amount', format: 'C0' }, { name: 'In_Stock', format: 'P0' }, 
    { name: 'Sold', format: 'N0' }], 
    columns: [{ name: 'Year' }, { name: 'Order_Source', caption: 'Order Source' }], 
    rows: [{ name: 'Country' }, { name: 'Products' }], 
    values: [{ name: 'In_Stock', caption: 'In Stock' }, 
    { name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }] 
}; 


Sample: https://stackblitz.com/edit/angular-grdtyr?file=app.component.ts 

Document: https://ej2.syncfusion.com/angular/documentation/pivotview/number-formatting/ 

Please let us know if you have any other queries. 

Regards, 
Manikandan

Mark · Answer

Thank you for the response, what I meant was if "In_Stock" === "Yes" then "Amount" === "C2" else "N0" or something like that.  Is that possible?

Manikandan Murugesan · Answer

Hi Mark, Using the “aggregateCellInfo” event, we can dynamically apply number formatting to each value in the pivot table. Setting the number format to each value based on the condition to “this.pivotObj.engineModule.formatFields” in the “aggregateCellInfo” event will achieve your requirement. Moreover, we have modified the sample with the given code example for your reference below. Sample: https://stackblitz.com/edit/angular-odvymq?file=app.component.ts Code Example: aggregateCellInfo(args) { if (args.fieldName === "Amount" && this.pivotObj.engineModule.formatFields[args.fieldName]) { delete this.pivotObj.engineModule.formatFields[args.fieldName]; this.pivotObj.engineModule.formatFields[args.fieldName] = { name: args.fieldName, format: (args.value > 999999 ? 'C2' : 'N0') }; } } Please let us know if you have any other queries. Regards, Manikandan