作者Observable

外观

d3-interpolate ​

此模块提供各种插值方法，用于在两个值之间进行混合。值可以是数字、颜色、字符串、数组，甚至深度嵌套的对象。例如

js
const i = d3.interpolateNumber(10, 20);
i(0.0); // 10
i(0.2); // 12
i(0.5); // 15
i(1.0); // 20

返回的函数 i 是一个插值器。给定一个起始值 a 和一个结束值 b，它接受一个参数 t 通常在 [0, 1] 范围内，并返回相应的插值值。插值器通常在 t = 0 时返回与 a 等效的值，在 t = 1 时返回与 b 等效的值。

您可以插值不仅仅是数字。要查找钢蓝色和棕色的感知中点

js
d3.interpolateLab("steelblue", "brown")(0.5); // "rgb(142, 92, 109)"

或者，作为从 t = 0 到 t = 1 的色阶

以下是一个更复杂的示例，展示了 interpolate 使用的类型推断

js
const i = d3.interpolate({colors: ["red", "blue"]}, {colors: ["white", "black"]});
i(0.0); // {colors: ["rgb(255, 0, 0)", "rgb(0, 0, 255)"]}
i(0.5); // {colors: ["rgb(255, 128, 128)", "rgb(0, 0, 128)"]}
i(1.0); // {colors: ["rgb(255, 255, 255)", "rgb(0, 0, 0)"]}

请注意，通用值插值器不仅可以检测嵌套对象和数组，还可以检测嵌入字符串中的颜色字符串和数字！

查看以下页面之一：