CODEWITHSUNDEEP
d3.jscrossfilterdc.js
DataByDavid
DataByDavid

Reputation: 1069

dc.js - How do I add Totals to a dataTable?

Suppose I have a datatable created in dc.js that looks like:

╔═══╦════════════╦═════════════╗
║   ║ Name       ║ Amount      ║
╠═══╬════════════╬═════════════╣
║ 1 ║ Bob        ║ 25          ║
║ 2 ║ Sam        ║ 25          ║
║ 3 ║ Steve      ║ 50          ║
╚═══╩════════════╩═════════════╝

How do I create a subtotal at the bottom?

╔═══╦════════════╦═════════════╗
║   ║ Name       ║ Amount      ║
╠═══╬════════════╬═════════════╣
║ 1 ║ Bob        ║ 25          ║
║ 2 ║ Sam        ║ 25          ║
║ 3 ║ Steve      ║ 50          ║
╚═══╩════════════╩═════════════╝
  Total is equal to 100
════════════════════════════════

Any help will be appreciated.

Ans:
I ended up adding the following code to the datatable to make it work.

.renderlet(function (d) { return UpdateSummary(d); });

Inside the function "UpdateSummary" is where I updated the text "Total is equal to 100"

Upvotes: 1

Views: 1398

Answers (1)

elsherbini
elsherbini

Reputation: 1616

If you share the code, I might be able to help more specifically. Here's my advice in the meantime.

dc.js uses crossfilter groups to set the data for tables. Whichever group you set to this table (in the .group() method) say

var helperArray = myGroup.all(),
total = 0;

helperArray.forEach(function(d) {total += d.value.amount;}) 
// console.log(d) to see what d is. it might need to just be total+= d.value

d3.select("body").append("p") //this should be changed to make it the right spot
    .text("Total is equal to " + total)

Something to that effect.

Upvotes: 2

Related Questions