descending order

Author: mbostock

src/channel.d.ts

@@ -1,6 +1,7 @@
 import type {Interval} from "./interval.js";
 import type {Reducer} from "./reducer.js";
 import type {ScaleName, ScaleType} from "./scales.js";
+import type {CompareFunction} from "./transforms/basic.js";
 import type {BinOptions} from "./transforms/bin.js";
 
 /** Lazily-constructed channel values derived from data. */
@@ -192,7 +193,10 @@ export interface ChannelDomainOptions {
    */
   reduce?: Reducer | boolean | null;
 
-  /** If true, use descending instead of ascending order. */
+  /** How to order reduces values. */
+  order?: CompareFunction | "ascending" | "descending" | null;
+
+  /** If true, reverse the order after sorting. */
   reverse?: boolean;
 
   /**

src/channel.js

@@ -1,4 +1,4 @@
-import {InternSet, rollup, sort} from "d3";
+import {InternSet, rollups} from "d3";
 import {ascendingDefined, descendingDefined} from "./defined.js";
 import {first, isColor, isEvery, isIterable, isOpacity, labelof, map, maybeValue, range, valueof} from "./options.js";
 import {registry} from "./scales/index.js";
@@ -78,11 +78,16 @@ export function inferChannelScale(name, channel) {
 // computed; i.e., if the scale’s domain is set explicitly, that takes priority
 // over the sort option, and we don’t need to do additional work.
 export function channelDomain(data, facets, channels, facetChannels, options) {
-  const {reverse: defaultReverse, reduce: defaultReduce = true, limit: defaultLimit} = options;
   for (const x in options) {
     if (!registry.has(x)) continue; // ignore unknown scale keys (including generic options)
-    let {value: y, reverse = defaultReverse, reduce = defaultReduce, limit = defaultLimit} = maybeValue(options[x]);
-    if (reverse === undefined) reverse = y === "width" || y === "height"; // default to descending for lengths
+    let {
+      value: y,
+      order = options.order,
+      reverse = options.reverse,
+      reduce = options.reduce === undefined ? true : options.reduce,
+      limit = options.limit
+    } = maybeValue(options[x]);
+    order = order === undefined ? y === "width" || y === "height" ? descendingGroup : ascendingGroup : maybeOrder(order); // prettier-ignore
     if (reduce == null || reduce === false) continue; // disabled reducer
     const X = x === "fx" || x === "fy" ? reindexFacetChannel(facets, facetChannels[x]) : findScaleChannel(channels, x);
     if (!X) throw new Error(`missing channel for scale: ${x}`);
@@ -106,12 +111,13 @@ export function channelDomain(data, facets, channels, facetChannels, options) {
           : values(channels, y, y === "y" ? "y2" : y === "x" ? "x2" : undefined);
       const reducer = maybeReduce(reduce === true ? "max" : reduce, YV);
       X.domain = () => {
-        let domain = rollup(
+        let domain = rollups(
           range(XV),
           (I) => reducer.reduceIndex(I, YV),
           (i) => XV[i]
         );
-        domain = sort(domain, reverse ? descendingGroup : ascendingGroup);
+        if (order) domain.sort(order);
+        if (reverse) domain.reverse();
         if (lo !== 0 || hi !== Infinity) domain = domain.slice(lo, hi);
         return domain.map(first);
       };
@@ -154,6 +160,17 @@ function values(channels, name, alias) {
   throw new Error(`missing channel: ${name}`);
 }
 
+function maybeOrder(order) {
+  if (typeof order === "function") return order;
+  switch (`${order}`.toLowerCase()) {
+    case "ascending":
+      return ascendingGroup;
+    case "descending":
+      return descendingGroup;
+  }
+  throw new Error(`invalid order: ${order}`);
+}
+
 function ascendingGroup([ak, av], [bk, bv]) {
   return ascendingDefined(av, bv) || ascendingDefined(ak, bk);
 }

test/plots/athletes-nationality.ts

@@ -11,7 +11,7 @@ export async function athletesNationality() {
       label: null
     },
     marks: [
-      Plot.barX(athletes, Plot.groupY({x: "count"}, {y: "nationality", sort: {y: "x", reverse: true, limit: 20}}))
+      Plot.barX(athletes, Plot.groupY({x: "count"}, {y: "nationality", sort: {y: "x", order: "descending", limit: 20}}))
     ]
   });
 }

test/plots/d3-survey-2015.ts

@@ -43,7 +43,7 @@ function bars(groups, title) {
         y: ([key]) => key,
         fill: "steelblue",
         insetTop: 1,
-        sort: {y: "x", reverse: true}
+        sort: {y: "x", order: "descending"}
       }),
       Plot.ruleX([0])
     ]

test/plots/learning-poverty.ts

@@ -30,7 +30,7 @@ export async function learningPoverty() {
         x: (d) => (d.type === "ok" ? -1 : 1) * d.share, // diverging bars
         y: "Country Name",
         fill: "type",
-        sort: {y: "x", reverse: true}
+        sort: {y: "x", order: "descending"}
       }),
       Plot.ruleX([0])
     ]

test/plots/metro-unemployment-ridgeline.ts

@@ -21,7 +21,7 @@ export async function metroUnemploymentRidgeline() {
     },
     marks: [
       Plot.areaY(data, {x: "date", y: "unemployment", fill: "#eee"}),
-      Plot.line(data, {x: "date", y: "unemployment", sort: {fy: "y", reverse: true}}),
+      Plot.line(data, {x: "date", y: "unemployment", sort: {fy: "y", order: "descending"}}),
       Plot.ruleY([0])
     ]
   });

test/plots/movies-rating-by-genre.ts

@@ -37,7 +37,7 @@ export async function moviesRatingByGenre() {
             sort: {
               fy: "x",
               reduce: "median",
-              reverse: true
+              order: "descending"
             }
           }
         )