expose range for continuous color scales (#560)

Co-authored-by: Philippe Rivière <[email protected]>

Author: mbostock

src/scales/quantitative.js

@@ -28,6 +28,7 @@ import {constant} from "../mark.js";
 import {order} from "../scales.js";
 
 export const flip = i => t => i(1 - t);
+const unit = [0, 1];
 
 const interpolators = new Map([
   // numbers
@@ -52,7 +53,7 @@ export function ScaleQ(key, scale, channels, {
   zero,
   domain = (registry.get(key) === radius || registry.get(key) === opacity ? inferZeroDomain : inferDomain)(channels),
   round,
-  range = registry.get(key) === radius ? inferRadialRange(channels, domain) : registry.get(key) === opacity ? [0, 1] : undefined,
+  range = registry.get(key) === radius ? inferRadialRange(channels, domain) : registry.get(key) === opacity ? unit : undefined,
   type,
   scheme = type === "cyclical" ? "rainbow" : "turbo",
   interpolate = registry.get(key) === color ? (range !== undefined ? interpolateRgb : quantitativeScheme(scheme)) : round ? interpolateRound : interpolateNumber,
@@ -77,12 +78,11 @@ export function ScaleQ(key, scale, channels, {
         interpolate = flip(interpolate);
         reverse = false;
       }
-      if (domain.length > 2) {
-        if (range === undefined) range = Float64Array.from(domain, (_, i) => i / (domain.length - 1));
-        scale.interpolate(interpolatePiecewise(interpolate));
-      } else {
-        scale.interpolate(constant(interpolate));
+      if (range === undefined) {
+        range = Float64Array.from(domain, (_, i) => i / (domain.length - 1));
+        if (range.length === 2) range = unit; // optimize common case of [0, 1]
       }
+      scale.interpolate((range === unit ? constant : interpolatePiecewise)(interpolate));
     } else {
       scale.interpolate(interpolate);
     }

test/scales/scales-test.js

@@ -296,6 +296,7 @@ it("plot(…).scale('color') can return a linear scale", () => {
   assert.deepStrictEqual(plot.scale("color"), {
     type: "linear",
     domain: [1, 5],
+    range: [0, 1],
     interpolate: d3.interpolateTurbo,
     clamp: false
   });
@@ -318,6 +319,7 @@ it("plot(…).scale('color') can return a utc scale", async () => {
   assert.deepStrictEqual(plot.scale("color"), {
     type: "utc",
     domain: [new Date("2013-05-13"), new Date("2018-05-11")],
+    range: [0, 1],
     interpolate: d3.interpolateTurbo,
     clamp: false
   });
@@ -696,6 +698,7 @@ it("plot(…).scale('color') promotes a cyclical scale to a linear scale", () =>
   assert.deepStrictEqual(plot.scale("color"), {
     type: "linear",
     domain: [1, 5],
+    range: [0, 1],
     interpolate: d3.interpolateRainbow,
     clamp: false
   });
@@ -706,6 +709,7 @@ it("plot(…).scale('color') ignores nonsensical options for cyclical scale", ()
   assert.deepStrictEqual(plot.scale("color"), {
     type: "linear",
     domain: [1, 5],
+    range: [0, 1],
     interpolate: d3.interpolateRainbow,
     clamp: false
   });
@@ -716,6 +720,7 @@ it("plot(…).scale('color') promotes a cyclical scale to a linear scale, even w
   assert.deepStrictEqual(plot.scale("color"), {
     type: "linear",
     domain: [1, 5],
+    range: [0, 1],
     interpolate: d3.interpolateBlues,
     clamp: false
   });
@@ -726,6 +731,7 @@ it("plot(…).scale('color') promotes a cyclical scale to a linear scale and ign
   assert.deepStrictEqual(plot.scale("color"), {
     type: "linear",
     domain: [1, 5],
+    range: [0, 1],
     interpolate: d3.interpolateWarm,
     clamp: false
   });
@@ -736,6 +742,7 @@ it("plot(…).scale('color') promotes a sequential scale to a linear scale, even
   assert.deepStrictEqual(plot.scale("color"), {
     type: "linear",
     domain: [1, 5],
+    range: [0, 1],
     interpolate: d3.interpolateBlues,
     clamp: false
   });
@@ -746,6 +753,7 @@ it("plot(…).scale('color') promotes a sequential scale to a linear scale and i
   assert.deepStrictEqual(plot.scale("color"), {
     type: "linear",
     domain: [1, 5],
+    range: [0, 1],
     interpolate: d3.interpolateWarm,
     clamp: false
   });
@@ -756,6 +764,7 @@ it("plot(…).scale('color') promotes a sequential scale to a linear scale", ()
   assert.deepStrictEqual(plot.scale("color"), {
     type: "linear",
     domain: [1, 5],
+    range: [0, 1],
     interpolate: d3.interpolateTurbo,
     clamp: false
   });
@@ -767,6 +776,7 @@ it("plot(…).scale('color') promotes a reversed sequential scale to a linear sc
   assert.deepStrictEqual(color, {
     type: "linear",
     domain: [1, 5],
+    range: [0, 1],
     clamp: false
   });
   for (const t of d3.ticks(1, 5, 100)) {