曲线

🌐 Curves

曲线将线或区域的离散（逐点）表示转化为连续形状：曲线指定了如何在二维[x, y]点之间进行插值。

🌐 Curves turn a discrete (pointwise) representation of a line or area into a continuous shape: curves specify how to interpolate between two-dimensional [x, y] points.

曲线通常不会被直接构建或使用。相反，内置曲线之一会被传递给 line.curve 或 area.curve。

🌐 Curves are typically not constructed or used directly. Instead, one of the built-in curves is being passed to line.curve or area.curve.

const line = d3.line()
    .x((d) => x(d.date))
    .y((d) => y(d.value))
    .curve(d3.curveCatmullRom.alpha(0.5));

如果需要，你可以实现一个自定义曲线。有关直接使用曲线的示例，请参见Context to Curve。

🌐 If desired, you can implement a custom curve. For an example of using a curve directly, see Context to Curve.

curveBasis(context)

来源 · 使用指定的控制点生成三次 基样条。第一个和最后一个点被重复三次，使得样条从第一个点开始，到最后一个点结束，并且与第一和第二个点之间的直线以及倒数第二个和最后一个点之间的直线切线相切。

curveBasisClosed(context)

来源 · 使用指定的控制点生成封闭的三次basis spline。当线段结束时，前三个控制点会被重复，从而生成具有C2连续性的封闭回路。

curveBasisOpen(context)

来源 · 使用指定的控制点生成三次 基样条。与 basis 不同，首尾点不重复，因此曲线通常不会经过这些点。

curveBumpX(context)

来源 · 在每对点之间生成贝塞尔曲线，并在每个点处具有水平切线。

curveBumpY(context)

来源 · 在每对点之间生成一条贝塞尔曲线，并在每个点处具有垂直切线。

曲线包(上下文)

🌐 curveBundle(context)

来源 · 使用指定的控制点生成一个直化的三次基样条，该样条根据曲线的beta进行直化，默认值为0.85。此曲线通常用于层次边打包以消除连接的歧义，如Danny Holten在Hierarchical Edge Bundles: Visualization of Adjacency Relations in Hierarchical Data中提出的。这条曲线不实现curve.areaStart和curve.areaEnd；它旨在与d3.line一起使用，而不是d3.area一起使用。

curveBundle.beta(beta)

贝塔：0.85

来源 · 返回一个具有指定 beta 的束曲线，beta 的范围为 [0, 1]，表示束强度。如果 beta 等于零，则生成第一点和最后一点之间的直线；如果 beta 等于一，则生成标准 基 样条。例如：

const line = d3.line().curve(d3.curveBundle.beta(0.5));

curveCardinal(context)

来源 · 使用指定的控制点生成三次基数样条，对第一段和最后一段使用单侧差分。张力的默认值为0。

curveCardinalClosed(context)

来源 · 使用指定的控制点生成一个闭合的三次基数样条。当线段结束时，前三个控制点会被重复，从而生成一个闭合环。默认的张力为0。

curveCardinalOpen(context)

Source · 使用指定的控制点生成三次基数样条。与curveCardinal不同，首尾段不使用单边差分，因此曲线从第二个点开始，到倒数第二个点结束。默认tension为0。

curveCardinal.张力(tension)

🌐 curveCardinal.tension(tension)

张力:0.00

来源 · 返回一个指定 张力 在 [0, 1] 范围内的基数曲线。张力 决定切线的长度：张力 为 1 时，所有切线为零，等同于 curveLinear；张力 为 0 时，生成均匀的 Catmull–Rom 样条。例如：

const line = d3.line().curve(d3.curveCardinal.tension(0.5));

curveCatmullRom(context)

来源 · 使用指定的控制点和参数 alpha 生成三次 Catmull–Rom 样条，默认值为 0.5，如 Yuksel 等人在 Catmull–Rom 曲线的参数化 中提出，对于第一段和最后一段使用单边差分。

curveCatmullRomClosed(context)

来源 · 使用指定的控制点和参数 alpha 生成一个封闭的三次 Catmull–Rom 样条曲线，默认值为 0.5，如 Yuksel 等人提出。当一条线段结束时，前三个控制点会被重复，从而生成一个闭合环路。

curveCatmullRomOpen(context)

来源 · 使用指定的控制点和参数alpha（默认为0.5，由Yuksel等人提出）生成三次Catmull–Rom样条曲线。与curveCatmullRom不同，首尾段不使用单边差分，因此曲线从第二个点开始，到倒数第二个点结束。

curveCatmullRom.alpha(alpha)

阿尔法:0.50

来源 · 返回一个指定 alpha（取值范围为 [0, 1]）的三次 Catmull–Rom 曲线。如果 alpha 为零，则生成均匀样条，相当于张力为零的 curveCardinal；如果 alpha 为一，则生成弦长样条；如果 alpha 为 0.5，则生成 向心样条。建议使用向心样条以避免自交和过冲。例如：

const line = d3.line().curve(d3.curveCatmullRom.alpha(0.5));

curveLinear(context)

来源 · 通过指定点生成一条折线。

curveLinearClosed(context)

来源 · 通过在折线段末端重复第一个点，在指定点之间生成闭合折线。

curveMonotoneX(context)

来源 · 生成一个三次样条曲线，在假设 x 单调的情况下，保持 y 的单调性，如 Steffen 在A simple method for monotonic interpolation in one dimension中提出的：“一条光滑曲线，具有连续的一阶导数，通过任意给定的数据点而不会出现虚假的振荡。局部极值只能出现在数据中给出的网格点上，而不会出现在两个相邻网格点之间。”

curveMonotoneY(context)

来源 · 生成一个三次样条曲线，在假设 y 单调的情况下，保持 x 单调性，如 Steffen 在 一维单调插值的简单方法 中提出的：“一条具有连续一阶导数的平滑曲线，能够通过任意给定的数据点而不会出现虚假的振荡。局部极值只能出现在数据给出的网格点上，而不能出现在两个相邻网格点之间。”

curveNatural(context)

来源 · 生成一个自然 三次样条，样条在端点处的二阶导数设为零。

曲线步骤(上下文)

🌐 curveStep(context)

来源 · 生成一个分段常数函数（一个阶梯函数），由交替的水平线和垂直线组成。每对相邻 x 值的中点处 y 值会发生变化。

curveStepAfter(context)

来源 · 生成一个分段常数函数（一个阶梯函数），由交替的水平线和垂直线组成。y 值在 x 值之后变化。

curveStepBefore(context)

来源 · 生成一个分段常数函数（一个阶梯函数），由交替的水平线和垂直线组成。y 值在 x 值之前变化。

自定义曲线

🌐 Custom curves

曲线通常不会被直接使用，而是传递给 line.curve 和 area.curve。然而，如果没有内置的曲线满足你的需求，你可以使用以下接口定义自己的曲线实现；有关示例实现，请参阅 curveLinear 源码。你也可以将此低级接口与内置曲线类型一起使用，作为 line 和 area 生成器的替代方案。

🌐 Curves are typically not used directly, instead being passed to line.curve and area.curve. However, you can define your own curve implementation should none of the built-in curves satisfy your needs using the following interface; see the curveLinear source for an example implementation. You can also use this low-level interface with a built-in curve type as an alternative to the line and area generators.

curve.areaStart()

表示一个新区域段的开始。每个区域段恰好由两个线段组成：首先是顶部线段，然后是基线，基线点的顺序是反向的。

🌐 Indicates the start of a new area segment. Each area segment consists of exactly two line segments: the topline, followed by the baseline, with the baseline points in reverse order.

curve.areaEnd()

表示当前区域段的终点。

🌐 Indicates the end of the current area segment.

curve.lineStart()

表示新线段的开始。之后将跟随零个或多个点。

🌐 Indicates the start of a new line segment. Zero or more points will follow.

curve.lineEnd()

表示当前线段的终点。

🌐 Indicates the end of the current line segment.

curve.point(x, y)

在当前线段中用给定的 x 和 y 值表示一个新点。

🌐 Indicates a new point in the current line segment with the given x- and y-values.