fix: d3v6 convert d3.nest to d3.groups

cfisher-scottlogic · Sep 23, 2020 · 2e9025f · 2e9025f
1 parent 3776d80
commit 2e9025f
Show file tree

Hide file tree

Showing 6 changed files with 16 additions and 23 deletions.
diff --git a/examples/boxplot/index.js b/examples/boxplot/index.js
@@ -23,12 +23,10 @@ d3.csv('github-repo-data.csv', d => ({
     };
 
     const languageQuartiles = d3
-        .nest()
-        .key(d => d.language)
-        .entries(githubData)
-        .map(languageGroup => ({
-            language: languageGroup.key,
-            quartile: quartile(languageGroup.values.map(d => d.forksPerStar))
+        .groups(githubData, d => d.language)
+        .map(([language, values]) => ({
+            language,
+            quartile: quartile(values.map(d => d.forksPerStar))
         }))
         .sort((a, b) => a.quartile.median - b.quartile.median);
 

diff --git a/examples/chart-zoom/index.js b/examples/chart-zoom/index.js
@@ -20,7 +20,7 @@ const area = fc
     .size(4);
 
 // create a d3-zoom that handles the mouse / touch interactions
-const zoom = d3.zoom().on('zoom', (event) => {
+const zoom = d3.zoom().on('zoom', event => {
     // update the scale used by the chart to use the updated domain
     x.domain(event.transform.rescaleX(x2).domain());
     y.domain(event.transform.rescaleY(y2).domain());

diff --git a/examples/interactive-small-multiples/index.js b/examples/interactive-small-multiples/index.js
@@ -4,9 +4,8 @@ d3.tsv('data.tsv', r => ({
     year: Number(r.year)
 })).then(data => {
     const nested = d3
-        .nest()
-        .key(k => k.category)
-        .entries(data);
+        .groups(data, k => k.category)
+        .map(([key, values]) => ({ key, values }));
 
     nested.forEach(g => (g.trackball = []));
 

diff --git a/examples/label-layout-chart/index.js b/examples/label-layout-chart/index.js
@@ -1,13 +1,11 @@
 d3.csv('repos-users-dump.csv').then(githubData => {
     // count the organisations / users for each language
     const scatter = d3
-        .nest()
-        .key(d => d.language)
-        .entries(githubData)
-        .map(lang => ({
-            language: lang.key,
-            orgs: lang.values.filter(d => d.type === 'Organization').length,
-            users: lang.values.filter(d => d.type === 'User').length
+        .groups(githubData, d => d.language)
+        .map(([key, values]) => ({
+            language: key,
+            orgs: values.filter(d => d.type === 'Organization').length,
+            users: values.filter(d => d.type === 'User').length
         }))
         .filter(d => d.language);
 

diff --git a/examples/marathon-pace/index.js b/examples/marathon-pace/index.js
@@ -12,9 +12,8 @@ d3.text('splits.csv').then(text => {
 
     // group into buckets
     let grouped = d3
-        .nest()
-        .key(bucketByHour)
-        .entries(splits)
+        .groups(splits, bucketByHour)
+        .map(([key, values]) => ({ key, values }))
         .sort((a, b) => d3.ascending(+a.key, +b.key));
 
     grouped.forEach(g => {

diff --git a/examples/small-multiples/index.js b/examples/small-multiples/index.js
@@ -28,9 +28,8 @@ const sales = [
 
 // group by month, giving our per-month small multiples
 const groupedByMonth = d3
-    .nest()
-    .key(d => d.Month)
-    .entries(sales);
+    .groups(sales, d => d.Month)
+    .map(([key, values]) => ({ key, values }));
 
 // the various series components
 const area = fc