From dcb564b298432c53a2ccc4320e41fa0258c95c3d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philippe=20Rivi=C3=A8re?= <fil@rezo.net>
Date: Fri, 30 Jul 2021 11:46:52 +0200
Subject: [PATCH] add the *mode* aggregation the plot example shows the most
 common word of length x as a title for each bar

closes #420

(cherry-pick of ea9f8cdf8e0181d748a8175b664e690e0dcd0183)
---
 README.md                           |  1 +
 src/transforms/group.js             |  3 +-
 test/output/wordLengthMobyDick.svg  | 56 +++++++++++++++++++++--------
 test/plots/word-length-moby-dick.js |  2 +-
 4 files changed, 46 insertions(+), 16 deletions(-)

diff --git a/README.md b/README.md
index f7cabc7799..3be95e9e43 100644
--- a/README.md
+++ b/README.md
@@ -990,6 +990,7 @@ The following aggregation methods are supported:
 * *median* - the median value
 * *deviation* - the standard deviation
 * *variance* - the variance per [Welford’s algorithm](https://en.wikipedia.org/wiki/Algorithms_for_calculating_variance#Welford's_online_algorithm)
+* *mode* - the value with the most occurrences
 * a function to be passed the array of values for each bin
 * an object with a *reduce* method
 
diff --git a/src/transforms/group.js b/src/transforms/group.js
index 7c6ee2f3b5..b3d7bcb5ae 100644
--- a/src/transforms/group.js
+++ b/src/transforms/group.js
@@ -1,4 +1,4 @@
-import {group as grouper, sort, sum, deviation, min, max, mean, median, variance, InternSet} from "d3";
+import {group as grouper, sort, sum, deviation, min, max, mean, median, mode, variance, InternSet} from "d3";
 import {firstof} from "../defined.js";
 import {valueof, maybeColor, maybeInput, maybeTransform, maybeTuple, maybeLazyChannel, lazyChannel, first, identity, take, labelof, range} from "../mark.js";
 
@@ -149,6 +149,7 @@ export function maybeReduce(reduce, value) {
     case "mean": return reduceAccessor(mean);
     case "median": return reduceAccessor(median);
     case "variance": return reduceAccessor(variance);
+    case "mode": return reduceAccessor(mode);
   }
   throw new Error("invalid reduce");
 }
diff --git a/test/output/wordLengthMobyDick.svg b/test/output/wordLengthMobyDick.svg
index c01a5f9d45..5b9cff28d1 100644
--- a/test/output/wordLengthMobyDick.svg
+++ b/test/output/wordLengthMobyDick.svg
@@ -90,19 +90,47 @@
     </g><text fill="currentColor" transform="translate(640,30)" dy="-0.32em" text-anchor="end">Word length →</text>
   </g>
   <g>
-    <rect x="45" width="37" y="284.59694989106754" height="85.40305010893246"></rect>
-    <rect x="86" width="37" y="46.688453159041444" height="323.31154684095856"></rect>
-    <rect x="127" width="37" y="20" height="350"></rect>
-    <rect x="168" width="37" y="42.11328976034861" height="327.8867102396514"></rect>
-    <rect x="209" width="37" y="180.89324618736387" height="189.10675381263613"></rect>
-    <rect x="250" width="37" y="231.98257080610028" height="138.01742919389972"></rect>
-    <rect x="291" width="37" y="258.6710239651416" height="111.32897603485839"></rect>
-    <rect x="332" width="37" y="307.4727668845316" height="62.52723311546839"></rect>
-    <rect x="373" width="37" y="315.86056644880176" height="54.13943355119824"></rect>
-    <rect x="414" width="37" y="338.73638344226583" height="31.263616557734167"></rect>
-    <rect x="455" width="37" y="357.79956427015253" height="12.20043572984747"></rect>
-    <rect x="496" width="37" y="357.03703703703707" height="12.962962962962933"></rect>
-    <rect x="537" width="37" y="363.89978213507624" height="6.1002178649237635"></rect>
-    <rect x="578" width="37" y="368.4749455337691" height="1.5250544662309267"></rect>
+    <rect x="45" width="37" y="284.59694989106754" height="85.40305010893246">
+      <title>a</title>
+    </rect>
+    <rect x="86" width="37" y="46.688453159041444" height="323.31154684095856">
+      <title>of</title>
+    </rect>
+    <rect x="127" width="37" y="20" height="350">
+      <title>the</title>
+    </rect>
+    <rect x="168" width="37" y="42.11328976034861" height="327.8867102396514">
+      <title>that</title>
+    </rect>
+    <rect x="209" width="37" y="180.89324618736387" height="189.10675381263613">
+      <title>there</title>
+    </rect>
+    <rect x="250" width="37" y="231.98257080610028" height="138.01742919389972">
+      <title>though</title>
+    </rect>
+    <rect x="291" width="37" y="258.6710239651416" height="111.32897603485839">
+      <title>because</title>
+    </rect>
+    <rect x="332" width="37" y="307.4727668845316" height="62.52723311546839">
+      <title>whenever</title>
+    </rect>
+    <rect x="373" width="37" y="315.86056644880176" height="54.13943355119824">
+      <title>passenger</title>
+    </rect>
+    <rect x="414" width="37" y="338.73638344226583" height="31.263616557734167">
+      <title>passengers</title>
+    </rect>
+    <rect x="455" width="37" y="357.79956427015253" height="12.20043572984747">
+      <title>circulation</title>
+    </rect>
+    <rect x="496" width="37" y="357.03703703703707" height="12.962962962962933">
+      <title>metaphysical</title>
+    </rect>
+    <rect x="537" width="37" y="363.89978213507624" height="6.1002178649237635">
+      <title>involuntarily</title>
+    </rect>
+    <rect x="578" width="37" y="368.4749455337691" height="1.5250544662309267">
+      <title>Circumambulate</title>
+    </rect>
   </g>
 </svg>
\ No newline at end of file
diff --git a/test/plots/word-length-moby-dick.js b/test/plots/word-length-moby-dick.js
index 15319707cc..5de3b53024 100644
--- a/test/plots/word-length-moby-dick.js
+++ b/test/plots/word-length-moby-dick.js
@@ -21,7 +21,7 @@ export default async function() {
       percent: true
     },
     marks: [
-      Plot.barY(words, Plot.groupX({y: "proportion"}, {x: "length"}))
+      Plot.barY(words, Plot.groupX({y: "proportion", title: "mode"}, {x: "length", title: d => d}))
     ]
   });
 }