D3

时间尺度 ​

🌐 Time scales

时间刻度是线性刻度的一种变体，具有时间域：域值被强制转换为日期而不是数字，反转操作同样返回一个日期。时间刻度基于日历间隔实现刻度，从而简化了为时间域生成轴的过程。

🌐 Time scales are a variant of linear scales that have a temporal domain: domain values are coerced to dates rather than numbers, and invert likewise returns a date. Time scales implement ticks based on calendar intervals, taking the pain out of generating axes for temporal domains.

scaleTime(domain, range) ​

示例 · 来源 · 使用指定的域和范围、默认插值器且禁用夹紧构造一个新的时间刻度。例如，要创建位置编码：

js
const x = d3.scaleTime([new Date(2000, 0, 1), new Date(2000, 0, 2)], [0, 960]);
x(new Date(2000, 0, 1, 5)); // 200
x(new Date(2000, 0, 1, 16)); // 640
x.invert(200); // Sat Jan 01 2000 05:00:00 GMT-0800 (PST)
x.invert(640); // Sat Jan 01 2000 16:00:00 GMT-0800 (PST)

如果未指定 domain，则默认为本地时间的 [2000-01-01, 2000-01-02]。如果未指定 range，则默认为 [0, 1]。

🌐 If domain is not specified, it defaults to [2000-01-01, 2000-01-02] in local time. If range is not specified, it defaults to [0, 1].

scaleUtc(domain, range) ​

示例 · 来源 · 相当于 scaleTime，但返回的时间刻度在 协调世界时 下操作，而不是本地时间。例如，要创建一个位置编码：

js
const x = d3.scaleUtc([new Date("2000-01-01"), new Date("2000-01-02")], [0, 960]);
x(new Date("2000-01-01T05:00Z")); // 200
x(new Date("2000-01-01T16:00Z")); // 640
x.invert(200); // 2000-01-01T05:00Z
x.invert(640); // 2000-01-01T16:00Z

如果未指定 domain，则默认为 UTC 时间的 [2000-01-01, 2000-01-02]。如果未指定 range，则默认为 [0, 1]。

🌐 If domain is not specified, it defaults to [2000-01-01, 2000-01-02] in UTC time. If range is not specified, it defaults to [0, 1].

TIP

应尽可能优先使用 UTC 计时，因为它的表现更可预测：一天总是二十四小时，并且该计时不依赖于浏览器的时区。

time.ticks(count) ​

示例 · 来源 · 返回刻度域中的代表日期。

js
const x = d3.scaleTime();
x.ticks(10);
// [Sat Jan 01 2000 00:00:00 GMT-0800 (PST),
//  Sat Jan 01 2000 03:00:00 GMT-0800 (PST),
//  Sat Jan 01 2000 06:00:00 GMT-0800 (PST),
//  Sat Jan 01 2000 09:00:00 GMT-0800 (PST),
//  Sat Jan 01 2000 12:00:00 GMT-0800 (PST),
//  Sat Jan 01 2000 15:00:00 GMT-0800 (PST),
//  Sat Jan 01 2000 18:00:00 GMT-0800 (PST),
//  Sat Jan 01 2000 21:00:00 GMT-0800 (PST),
//  Sun Jan 02 2000 00:00:00 GMT-0800 (PST)]

返回的刻度值大多是均匀分布的，具有合理的值（例如每天午夜），并且保证在域的范围内。刻度通常用于显示参考线或刻度标记，与可视化数据结合使用。

🌐 The returned tick values are uniformly-spaced (mostly), have sensible values (such as every day at midnight), and are guaranteed to be within the extent of the domain. Ticks are often used to display reference lines, or tick marks, in conjunction with the visualized data.

可以指定一个可选的 count 来影响生成多少刻度。如果未指定 count，默认为 10。指定的 count 只是一个提示；刻度的返回值可能会根据域生成更多或更少的值。

🌐 An optional count may be specified to affect how many ticks are generated. If count is not specified, it defaults to 10. The specified count is only a hint; the scale may return more or fewer values depending on the domain.

以下时间间隔将用于自动刻度：

🌐 The following time intervals are considered for automatic ticks:

  • 1、5、15 和 30 秒。
  • 1、5、15 和 30 分钟。
  • 1、3、6 和 12 小时。
  • 1 天和 2 天。
  • 1-week.
  • 1 个月和 3 个月。
  • 1-year.

可以明确指定时间 间隔，以替代 计数。要修剪给定时间 间隔 的生成刻度，请使用 interval.every。例如，要生成每 15 分钟的刻度：

🌐 In lieu of a count, a time interval may be explicitly specified. To prune the generated ticks for a given time interval, use interval.every. For example, to generate ticks at 15-minute intervals:

js
const x = d3.scaleUtc().domain([new Date("2000-01-01T00:00Z"), new Date("2000-01-01T02:00Z")]);
x.ticks(d3.utcMinute.every(15));
// [2000-01-01T00:00Z,
//  2000-01-01T00:15Z,
//  2000-01-01T00:30Z,
//  2000-01-01T00:45Z,
//  2000-01-01T01:00Z,
//  2000-01-01T01:15Z,
//  2000-01-01T01:30Z,
//  2000-01-01T01:45Z,
//  2000-01-01T02:00Z]

注意：在某些情况下，例如使用日刻度时，指定一个步长可能导致刻度间距不规律，因为时间间隔的长度各不相同。

🌐 Note: in some cases, such as with day ticks, specifying a step can result in irregular spacing of ticks because time intervals have varying length.

time.tickFormat(count, specifier) ​

示例 · 来源 · 返回一个适合显示 刻度 值的时间格式函数。

js
const x = d3.scaleUtc().domain([new Date("2000-01-01T00:00Z"), new Date("2000-01-01T02:00Z")]);
const T = x.ticks(); // [2000-01-01T00:00Z, 2000-01-01T00:15Z, 2000-01-01T00:30Z, …]
const f = x.tickFormat();
T.map(f); // ["2000", "12:15", "12:30", "12:45", "01 AM", "01:15", "01:30", "01:45", "02 AM"]

指定的 count 当前会被忽略，但为了与其他刻度（如 linear.tickFormat）保持一致而被接受。如果指定了格式 specifier，此方法等同于 format。如果未指定 specifier，则返回默认的时间格式。默认的多尺度时间格式会根据指定的日期选择一个可读的表示方式，如下所示：

🌐 The specified count is currently ignored, but is accepted for consistency with other scales such as linear.tickFormat. If a format specifier is specified, this method is equivalent to format. If specifier is not specified, the default time format is returned. The default multi-scale time format chooses a human-readable representation based on the specified date as follows:

  • %Y - 用于年份边界，例如 2011。
  • %B - 用于月份边界，例如 February。
  • %b %d - 用于周边界，例如 Feb 06。
  • %a %d - 用于天界限，例如 Mon 07。
  • %I %p - 对于小时边界，例如 01 AM。
  • %I:%M - 对于分钟边界，例如 01:23。
  • :%S - 对于第二边界，例如 :45。
  • .%L - 对于所有其他时间，例如 .012，使用毫秒。

虽然有些不寻常，但这种默认行为的好处是同时提供了本地和全局上下文：例如，将一系列刻度格式化为 [11 PM, Mon 07, 01 AM] 可以同时显示小时、日期和星期信息，而不仅仅是小时 [11 PM, 12 AM, 01 AM]。如果你想自定义条件时间格式，请参见 d3-time-format。

🌐 Although somewhat unusual, this default behavior has the benefit of providing both local and global context: for example, formatting a sequence of ticks as [11 PM, Mon 07, 01 AM] reveals information about hours, dates, and day simultaneously, rather than just the hours [11 PM, 12 AM, 01 AM]. See d3-time-format if you’d like to roll your own conditional time format.

time.nice(count) ​

示例 · 来源 · 扩展域，使其在整齐的圆整值上开始和结束。

js
const x = d3.scaleUtc().domain([new Date("2000-01-01T12:34Z"), new Date("2000-01-01T12:59Z")]).nice();
x.domain(); // [2000-01-01T12:30Z, 2000-01-01T13:00Z]

这种方法通常会修改刻度的域，并且可能只将范围扩展到最接近的整值。有关更多信息，请参见 linear.nice。

🌐 This method typically modifies the scale’s domain, and may only extend the bounds to the nearest round value. See linear.nice for more.

一个可选的刻度 count 参数允许更精确地控制用于扩展边界的步长，保证返回的ticks将完全覆盖该域。或者，可以指定一个时间 interval 来显式设置刻度。如果指定了 interval，也可以可选地指定 step 来跳过一些刻度。例如，time.nice(d3.utcSecond.every(10)) 将把域扩展到整十秒（0, 10, 20, 等等 ）。有关更多详细信息，请参见 time.ticks 和 interval.every。

如果域是从数据计算出来的，比如使用 extent，并且可能是不规则的，那么 nicing 是有用的。例如，对于域 [2009-07-13T00:02, 2009-07-13T23:48]，nice 的域为 [2009-07-13, 2009-07-14]。如果域有超过两个值，nicing 只会影响第一个和最后一个值。

🌐 Nicing is useful if the domain is computed from data, say using extent, and may be irregular. For example, for a domain of [2009-07-13T00:02, 2009-07-13T23:48], the nice domain is [2009-07-13, 2009-07-14]. If the domain has more than two values, nicing the domain only affects the first and last value.