D3

顺序尺度 ​

🌐 Sequential scales

序列比例与线性比例相似，因为它们将连续的数值输入域映射到连续的输出范围。与线性比例不同，序列比例的输入域和输出范围始终只有两个元素，并且输出范围通常指定为插值器，而不是数值数组。序列比例通常用于颜色编码；另见d3-scale-chromatic。这些比例不提供invert和interpolate方法。序列比例还有对数、幂、符号对数和分位数变体。

🌐 Sequential scales are similar to linear scales in that they map a continuous, numeric input domain to a continuous output range. Unlike linear scales, the input domain and output range of a sequential scale always have exactly two elements, and the output range is typically specified as an interpolator rather than an array of values. Sequential scales are typically used for a color encoding; see also d3-scale-chromatic. These scales do not expose invert and interpolate methods. There are also log, pow, symlog, and quantile variants of sequential scales.

scaleSequential(domain，interpolator) ​

🌐 scaleSequential(domain, interpolator)

示例 · 来源 · 使用指定的域和插值器函数或数组构建一个新的顺序刻度。

js
const color = d3.scaleSequential([0, 100], d3.interpolateBlues);

如果未指定 domain，则默认为 [0, 1]。

🌐 If domain is not specified, it defaults to [0, 1].

js
const color = d3.scaleSequential(d3.interpolateBlues);

如果未指定 interpolator，则默认为恒等函数。

🌐 If interpolator is not specified, it defaults to the identity function.

js
const identity = d3.scaleSequential();

当应用该缩放时，插值器将以通常在 [0, 1] 范围内的值被调用，其中 0 表示最小值，1 表示最大值。例如，要实现不明智的愤怒彩虹缩放（请改用 interpolateRainbow）：

🌐 When the scale is applied, the interpolator will be invoked with a value typically in the range [0, 1], where 0 represents the minimum value and 1 represents the maximum value. For example, to implement the ill-advised angry rainbow scale (please use interpolateRainbow instead):

js
const rainbow = d3.scaleSequential((t) => d3.hsl(t * 360, 1, 0.5) + "");

如果 interpolator 是一个数组，它表示比例的两个元素输出范围，并使用 interpolate 转换为插值函数。

🌐 If interpolator is an array, it represents the scale’s two-element output range and is converted to an interpolator function using interpolate.

js
const color = d3.scaleSequential(["red", "blue"]);

顺序比例尺的域必须是数字，并且必须恰好包含两个值。

🌐 A sequential scale’s domain must be numeric and must contain exactly two values.

顺序.插值器(插值器) ​

🌐 sequential.interpolator(interpolator)

如果指定了 interpolator，则将比例的插值器设置为指定的函数。

🌐 If interpolator is specified, sets the scale’s interpolator to the specified function.

js
const color = d3.scaleSequential().interpolator(d3.interpolateBlues);

如果未指定 interpolator，则返回比例当前的插值器。

🌐 If interpolator is not specified, returns the scale’s current interpolator.

js
color.interpolator() // d3.interpolateBlues

顺序.范围(范围) ​

🌐 sequential.range(range)

请参见 linear.range。如果指定了 range，给定的两个元素数组将使用 interpolate 转换为插值函数。

🌐 See linear.range. If range is specified, the given two-element array is converted to an interpolator function using interpolate.

js
const color = d3.scaleSequential().range(["red", "blue"]);

以上内容等同于：

🌐 The above is equivalent to:

js
const color = d3.scaleSequential(d3.interpolate("red", "blue"));

sequential.rangeRound(range) ​

参见 linear.rangeRound。如果指定了 range，将隐式使用 interpolateRound 作为插值器。

🌐 See linear.rangeRound. If range is specified, implicitly uses interpolateRound as the interpolator.

scaleSequentialLog(domain, range) ​

返回一个具有对数变换的新顺序比例，类似于对数比例。

🌐 Returns a new sequential scale with a logarithmic transform, analogous to a log scale.

scaleSequentialPow(domain, range) ​

返回一个带有指数变换的新顺序比例，类似于幂比例。

🌐 Returns a new sequential scale with an exponential transform, analogous to a power scale.

scaleSequentialSqrt(domain, range) ​

返回一个具有平方根变换的新顺序比例，类似于 sqrt scale。

🌐 Returns a new sequential scale with a square-root transform, analogous to a sqrt scale.

scaleSequentialSymlog(domain, range) ​

返回一个具有对称对数变换的新顺序比例，类似于 symlog 比例。

🌐 Returns a new sequential scale with a symmetric logarithmic transform, analogous to a symlog scale.

scaleSequentialQuantile(domain, range) ​

来源 · 返回一个新的顺序比例尺，带有 p 分位数变换，类似于 分位数比例尺。

sequentialQuantile.quantiles(n) ​

来源 · 返回一个包含 n + 1 个分位数的数组。

js
const color = d3.scaleSequentialQuantile()
    .domain(penguins.map((d) => d.body_mass_g))
    .interpolator(d3.interpolateBlues);

color.quantiles(4); // [2700, 3550, 4050, 4750, 6300]

例如，如果 n = 4，则返回一个包含五个数字的数组：最小值、第一个四分位数、中位数、第三个四分位数和最大值。

🌐 For example, if n = 4, returns an array of five numbers: the minimum value, the first quartile, the median, the third quartile, and the maximum.