-
Notifications
You must be signed in to change notification settings - Fork 70
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Replace d3.interpolateBind with named parameters.
Rather than have interpolators take optional arguments, and then require
d3-scale to bind those optional arguments, configurable interpolators (of which
cubehelix is the only one, so far) now expose named configuration methods.
var i = d3.interpolateCubehelix("red", "blue", 3); // BEFORE
var i = d3.interpolateCubehelix.gamma(3)("red", "blue"); // AFTER
This makes the usage of optional parameters self-documenting.
Related d3/d3-ease#13.- Loading branch information
Showing
9 changed files
with
204 additions
and
80 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,20 +1,27 @@ | ||
| import {cubehelix} from "d3-color"; | ||
| import {cubehelix as color} from "d3-color"; | ||
| import deltaHue from "./deltaHue"; | ||
|
|
||
| export default function(a, b, gamma) { | ||
| gamma = gamma == null ? 1 : +gamma; | ||
| a = cubehelix(a); | ||
| b = cubehelix(b); | ||
| var ah = isNaN(a.h) ? b.h : a.h, | ||
| as = isNaN(a.s) ? b.s : a.s, | ||
| al = a.l, | ||
| bh = isNaN(b.h) ? 0 : deltaHue(b.h, ah), | ||
| bs = isNaN(b.s) ? 0 : b.s - as, | ||
| bl = b.l - al; | ||
| return function(t) { | ||
| a.h = ah + bh * t; | ||
| a.s = as + bs * t; | ||
| a.l = al + bl * Math.pow(t, gamma); | ||
| return a + ""; | ||
| }; | ||
| } | ||
| export default (function gamma(y) { | ||
| y = +y; | ||
|
|
||
| function cubehelix(a, b) { | ||
| a = color(a); | ||
| b = color(b); | ||
| var ah = isNaN(a.h) ? b.h : a.h, | ||
| as = isNaN(a.s) ? b.s : a.s, | ||
| al = a.l, | ||
| bh = isNaN(b.h) ? 0 : deltaHue(b.h, ah), | ||
| bs = isNaN(b.s) ? 0 : b.s - as, | ||
| bl = b.l - al; | ||
| return function(t) { | ||
| a.h = ah + bh * t; | ||
| a.s = as + bs * t; | ||
| a.l = al + bl * Math.pow(t, y); | ||
| return a + ""; | ||
| }; | ||
| } | ||
|
|
||
| cubehelix.gamma = gamma; | ||
|
|
||
| return cubehelix; | ||
| })(1); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,19 +1,26 @@ | ||
| import {cubehelix} from "d3-color"; | ||
| import {cubehelix as color} from "d3-color"; | ||
|
|
||
| export default function(a, b, gamma) { | ||
| gamma = gamma == null ? 1 : +gamma; | ||
| a = cubehelix(a); | ||
| b = cubehelix(b); | ||
| var ah = isNaN(a.h) ? b.h : a.h, | ||
| as = isNaN(a.s) ? b.s : a.s, | ||
| al = a.l, | ||
| bh = isNaN(b.h) ? 0 : b.h - ah, | ||
| bs = isNaN(b.s) ? 0 : b.s - as, | ||
| bl = b.l - al; | ||
| return function(t) { | ||
| a.h = ah + bh * t; | ||
| a.s = as + bs * t; | ||
| a.l = al + bl * Math.pow(t, gamma); | ||
| return a + ""; | ||
| }; | ||
| } | ||
| export default (function gamma(y) { | ||
| y = +y; | ||
|
|
||
| function cubehelix(a, b) { | ||
| a = color(a); | ||
| b = color(b); | ||
| var ah = isNaN(a.h) ? b.h : a.h, | ||
| as = isNaN(a.s) ? b.s : a.s, | ||
| al = a.l, | ||
| bh = isNaN(b.h) ? 0 : b.h - ah, | ||
| bs = isNaN(b.s) ? 0 : b.s - as, | ||
| bl = b.l - al; | ||
| return function(t) { | ||
| a.h = ah + bh * t; | ||
| a.s = as + bs * t; | ||
| a.l = al + bl * Math.pow(t, y); | ||
| return a + ""; | ||
| }; | ||
| } | ||
|
|
||
| cubehelix.gamma = gamma; | ||
|
|
||
| return cubehelix; | ||
| })(1); |
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,72 @@ | ||
| var tape = require("tape"), | ||
| color = require("d3-color"), | ||
| interpolate = require("../"); | ||
|
|
||
| tape("interpolateCubehelix(a, b) converts a and b to Cubehelix colors", function(test) { | ||
| test.equal(interpolate.interpolateCubehelix("steelblue", "brown")(0), color.rgb("steelblue") + ""); | ||
| test.equal(interpolate.interpolateCubehelix("steelblue", color.hcl("brown"))(1), color.rgb("brown") + ""); | ||
| test.equal(interpolate.interpolateCubehelix("steelblue", color.rgb("brown"))(1), color.rgb("brown") + ""); | ||
| test.end(); | ||
| }); | ||
|
|
||
| tape("interpolateCubehelix(a, b) interpolates in Cubehelix and returns an RGB hexadecimal string", function(test) { | ||
| test.equal(interpolate.interpolateCubehelix("steelblue", "#f00")(0.2), "#5864da"); | ||
| test.end(); | ||
| }); | ||
|
|
||
| tape("interpolateCubehelix.gamma(3)(a, b) returns the expected values", function(test) { | ||
| test.equal(interpolate.interpolateCubehelix.gamma(3)("steelblue", "#f00")(0.2), "#606be4"); | ||
| test.end(); | ||
| }); | ||
|
|
||
| tape("interpolateCubehelix.gamma(g) coerces the specified gamma to a number", function(test) { | ||
| test.equal(interpolate.interpolateCubehelix.gamma({valueOf: function() { return 3; }})("steelblue", "#f00")(0.2), "#606be4"); | ||
| test.end(); | ||
| }); | ||
|
|
||
| tape("interpolateCubehelix(a, b) is equivalent to interpolateCubehelix.gamma(1)(a, b)", function(test) { | ||
| var i0 = interpolate.interpolateCubehelix.gamma(1)("purple", "orange"), | ||
| i1 = interpolate.interpolateCubehelix("purple", "orange"); | ||
| test.equal(i1(0.0), i0(0.0)); | ||
| test.equal(i1(0.2), i0(0.2)); | ||
| test.equal(i1(0.4), i0(0.4)); | ||
| test.equal(i1(0.6), i0(0.6)); | ||
| test.equal(i1(0.8), i0(0.8)); | ||
| test.equal(i1(1.0), i0(1.0)); | ||
| test.end(); | ||
| }); | ||
|
|
||
| tape("interpolateCubehelix(a, b) uses the shortest path when interpolating hue difference greater than 180°", function(test) { | ||
| var i = interpolate.interpolateCubehelix("purple", "orange"); | ||
| test.equal(i(0.0), "#800080"); | ||
| test.equal(i(0.2), "#d0017f"); | ||
| test.equal(i(0.4), "#ff115d"); | ||
| test.equal(i(0.6), "#ff342b"); | ||
| test.equal(i(0.8), "#ff6905"); | ||
| test.equal(i(1.0), "#ffa500"); | ||
| test.end(); | ||
| }); | ||
|
|
||
| tape("interpolateCubehelix(a, b) uses a’s hue when b’s hue is undefined", function(test) { | ||
| test.equal(interpolate.interpolateCubehelix("#f60", color.hcl(NaN, NaN, 0))(0.5), "#a22900"); | ||
| test.equal(interpolate.interpolateCubehelix("#6f0", color.hcl(NaN, NaN, 0))(0.5), "#03ad00"); | ||
| test.end(); | ||
| }); | ||
|
|
||
| tape("interpolateCubehelix(a, b) uses b’s hue when a’s hue is undefined", function(test) { | ||
| test.equal(interpolate.interpolateCubehelix(color.hcl(NaN, NaN, 0), "#f60")(0.5), "#a22900"); | ||
| test.equal(interpolate.interpolateCubehelix(color.hcl(NaN, NaN, 0), "#6f0")(0.5), "#03ad00"); | ||
| test.end(); | ||
| }); | ||
|
|
||
| tape("interpolateCubehelix(a, b) uses a’s chroma when b’s chroma is undefined", function(test) { | ||
| test.equal(interpolate.interpolateCubehelix("#ccc", color.hcl(NaN, NaN, 0))(0.5), "#666666"); | ||
| test.equal(interpolate.interpolateCubehelix("#f00", color.hcl(NaN, NaN, 0))(0.5), "#930000"); | ||
| test.end(); | ||
| }); | ||
|
|
||
| tape("interpolateCubehelix(a, b) uses b’s chroma when a’s chroma is undefined", function(test) { | ||
| test.equal(interpolate.interpolateCubehelix(color.hcl(NaN, NaN, 0), "#ccc")(0.5), "#666666"); | ||
| test.equal(interpolate.interpolateCubehelix(color.hcl(NaN, NaN, 0), "#f00")(0.5), "#930000"); | ||
| test.end(); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,71 @@ | ||
| var tape = require("tape"), | ||
| color = require("d3-color"), | ||
| interpolate = require("../"); | ||
|
|
||
| tape("interpolateCubehelixLong(a, b) converts a and b to Cubehelix colors", function(test) { | ||
| test.equal(interpolate.interpolateCubehelixLong("steelblue", "brown")(0), color.rgb("steelblue") + ""); | ||
| test.equal(interpolate.interpolateCubehelixLong("steelblue", color.hcl("brown"))(1), color.rgb("brown") + ""); | ||
| test.equal(interpolate.interpolateCubehelixLong("steelblue", color.rgb("brown"))(1), color.rgb("brown") + ""); | ||
| test.end(); | ||
| }); | ||
|
|
||
| tape("interpolateCubehelixLong(a, b) interpolates in Cubehelix and returns an RGB hexadecimal string", function(test) { | ||
| test.equal(interpolate.interpolateCubehelixLong("steelblue", "#f00")(0.2), "#5864da"); | ||
| test.end(); | ||
| }); | ||
|
|
||
| tape("interpolateCubehelixLong.gamma(3)(a, b) returns the expected values", function(test) { | ||
| test.equal(interpolate.interpolateCubehelixLong.gamma(3)("steelblue", "#f00")(0.2), "#606be4"); | ||
| test.end(); | ||
| }); | ||
|
|
||
| tape("interpolateCubehelixLong.gamma(g) coerces the specified gamma to a number", function(test) { | ||
| test.equal(interpolate.interpolateCubehelixLong.gamma({valueOf: function() { return 3; }})("steelblue", "#f00")(0.2), "#606be4"); | ||
| test.end(); | ||
| }); | ||
|
|
||
| tape("interpolateCubehelixLong(a, b) is equivalent to interpolateCubehelixLong.gamma(1)(a, b)", function(test) { | ||
| var i0 = interpolate.interpolateCubehelixLong.gamma(1)("purple", "orange"), | ||
| i1 = interpolate.interpolateCubehelixLong("purple", "orange"); | ||
| test.equal(i1(0.0), i0(0.0)); | ||
| test.equal(i1(0.2), i0(0.2)); | ||
| test.equal(i1(0.4), i0(0.4)); | ||
| test.equal(i1(0.6), i0(0.6)); | ||
| test.equal(i1(0.8), i0(0.8)); | ||
| test.equal(i1(1.0), i0(1.0)); | ||
| test.end(); | ||
| }); | ||
| tape("interpolateCubehelixLong(a, b) uses the longest path when interpolating hue difference greater than 180°", function(test) { | ||
| var i = interpolate.interpolateCubehelixLong("purple", "orange"); | ||
| test.equal(i(0.0), "#800080"); | ||
| test.equal(i(0.2), "#3f36ea"); | ||
| test.equal(i(0.4), "#0097d9"); | ||
| test.equal(i(0.6), "#00df53"); | ||
| test.equal(i(0.8), "#4fdb00"); | ||
| test.equal(i(1.0), "#ffa500"); | ||
| test.end(); | ||
| }); | ||
|
|
||
| tape("interpolateCubehelixLong(a, b) uses a’s hue when b’s hue is undefined", function(test) { | ||
| test.equal(interpolate.interpolateCubehelixLong("#f60", color.hcl(NaN, NaN, 0))(0.5), "#a22900"); | ||
| test.equal(interpolate.interpolateCubehelixLong("#6f0", color.hcl(NaN, NaN, 0))(0.5), "#03ad00"); | ||
| test.end(); | ||
| }); | ||
|
|
||
| tape("interpolateCubehelixLong(a, b) uses b’s hue when a’s hue is undefined", function(test) { | ||
| test.equal(interpolate.interpolateCubehelixLong(color.hcl(NaN, NaN, 0), "#f60")(0.5), "#a22900"); | ||
| test.equal(interpolate.interpolateCubehelixLong(color.hcl(NaN, NaN, 0), "#6f0")(0.5), "#03ad00"); | ||
| test.end(); | ||
| }); | ||
|
|
||
| tape("interpolateCubehelixLong(a, b) uses a’s chroma when b’s chroma is undefined", function(test) { | ||
| test.equal(interpolate.interpolateCubehelixLong("#ccc", color.hcl(NaN, NaN, 0))(0.5), "#666666"); | ||
| test.equal(interpolate.interpolateCubehelixLong("#f00", color.hcl(NaN, NaN, 0))(0.5), "#930000"); | ||
| test.end(); | ||
| }); | ||
|
|
||
| tape("interpolateCubehelixLong(a, b) uses b’s chroma when a’s chroma is undefined", function(test) { | ||
| test.equal(interpolate.interpolateCubehelixLong(color.hcl(NaN, NaN, 0), "#ccc")(0.5), "#666666"); | ||
| test.equal(interpolate.interpolateCubehelixLong(color.hcl(NaN, NaN, 0), "#f00")(0.5), "#930000"); | ||
| test.end(); | ||
| }); |