d3 Grouping and Summarization

问题

I have a JSON data object consisting of zones, zip codes, and quantities of items for each zip code. I am trying to summarize (rollup) a summation of quantities and count of the number of records by zone. I am using d3.js currently, but am open to other libraries if they suit the need better.

An example of the original data structure:

var test = [  
   {  
      "Name":"One Name",
      "Zip":"75001",
      "Zone":"A",
      "qty":60
   },
   {  
      "Name":"Two Name",
      "Zip":"75003",
      "Zone":"A",
      "qty":40
   },
   {  
      "Name":"Three Name",
      "Zip":"75009",
      "Zone":"B",
      "qty":20
   }
]

And here is the desired result I am trying to achieve:

[  
   {  
      "Zone":"A",
      "qtySum":100,
      "cnt":2,
      "values":[  
         {  
            "Name":"One Name",
            "Zip":"75001",
            "Zone":"A",
            "qty":60
         },
         {  
            "Name":"Two Name",
            "Zip":"75003",
            "Zone":"A",
            "qty":40
         }
      ]
   },
   {  
      "Zone":"B",
      "qtySum":20,
      "cnt":1,
      "values":[  
         {  
            "Name":"Three Name",
            "Zip":"75009",
            "Zone":"B",
            "qty":20
         }
      ]
   }
]

I can achieve the grouping without the summary data by doing:

d3.nest()
.key(function(d) { return d.Zone; })
.entries(test)

And I can rollup the data into a summary object by:

d3.nest()
.key(function(d) { return d.Zone; })
.rollup(function(v) { return {
        count: v.length,
        total: d3.sum(v, function(d) { return d.qty; }),
    }; 
})
.entries(test);

But I cannot manage to get both to work together. I thought about manually looping through the the summary object and stuffing it with the corresponding records from the original object, but that seems like it would be too much overhead.

回答1:

You was very close with rollup. To add the original objects, add values: v to the returned object. Then, use map to alter the object and return it in the required format.

var test = [  
   {  
      "Name":"One Name",
      "Zip":"75001",
      "Zone":"A",
      "qty":60
   },
   {  
      "Name":"Two Name",
      "Zip":"75003",
      "Zone":"A",
      "qty":40
   },
   {  
      "Name":"Three Name",
      "Zip":"75009",
      "Zone":"B",
      "qty":20
   }
];

var grouped = d3.nest()
  .key(function(d) { return d.Zone; })
  .rollup(function(v) { 
    return {
      cnt: v.length,
      qtySum: d3.sum(v, function(d) { return d.qty; }),
      values: v
    }; 
  })
  .entries(test)
  .map(function(d) {
    return {
      Zone: d.key,
      qtySum: d.value.qtySum,
      cnt: d.value.cnt,
      values: d.value.values
    };
  });

d3.select("#foo").text(JSON.stringify(grouped, null, 2));

<script src="https://d3js.org/d3.v4.min.js"></script>
<pre id="foo"></pre>

来源：https://stackoverflow.com/questions/50454720/d3-grouping-and-summarization

标签

javascript

d3.js