Skip to content

轮廓多边形

¥Contour polygons

对于每个 阈值轮廓生成器 都会构建一个 GeoJSON MultiPolygon 几何对象,表示输入值大于或等于阈值的区域。几何图形采用平面坐标系,其中 ⟨i + 0.5, j + 0.5⟩ 对应于输入值数组中的元素 i + jn

¥For each threshold value, the contour generator constructs a GeoJSON MultiPolygon geometry object representing the area where the input values are greater than or equal to the threshold value. The geometry is in planar coordinates, where ⟨i + 0.5, j + 0.5⟩ corresponds to element i + jn in the input values array.

以下示例加载了地表温度的 GeoTIFF 文件,另一个示例模糊了嘈杂的单色 PNG 图片以生成平滑的云量轮廓:

¥Here is an example that loads a GeoTIFF of surface temperatures, and another that blurs a noisy monochrome PNG to produce smooth contours of cloud fraction:

由于轮廓多边形是 GeoJSON 格式,你可以使用标准工具对其进行转换和显示;例如,请参阅 geoPathgeoProjectgeoStitch。以上地表温度轮廓在自然地球投影中的显示方式:

¥Since the contour polygons are GeoJSON, you can transform and display them using standard tools; see geoPath, geoProject and geoStitch, for example. Here the above contours of surface temperature are displayed in the Natural Earth projection:

轮廓图还可以通过采样可视化连续函数。以下是 Goldstein-Price 函数(用于全局优化的测试函数)和 sin(x + y)sin(x) 的迷幻动画 - y):

¥Contour plots can also visualize continuous functions by sampling. Here is the Goldstein–Price function (a test function for global optimization) and a trippy animation of sin(x + y)sin(x - y):

contours()

示例 · 源代码 · 使用默认设置构造一个新的轮廓生成器。

¥Examples · Source · Constructs a new contour generator with the default settings.

js
const contours = d3.contours()
    .size([width, height])
    .thresholds([0, 1, 2, 3, 4]);

contours(values) {#_contours}

源代码 · 根据给定的数值数组计算轮廓线,返回一个包含 GeoJSON MultiPolygon 几何对象 的数组。

¥Source · Computes the contours for the given array of values, returning an array of GeoJSON MultiPolygon geometry objects.

js
const polygons = contours(grid);

每个几何对象都表示输入 大于或等于相应 阈值 的区域;每个几何对象的阈值以 geometry.value 的形式公开。

¥Each geometry object represents the area where the input values are greater than or equal to the corresponding threshold value; the threshold value for each geometry object is exposed as geometry.value.

输入值必须是长度为 n×m 的数组,其中 [n, m] 是轮廓生成器的 size;此外,每个 values[i + jn] 必须表示位置 ⟨i, j⟩ 处的值。例如,要为 Goldstein–Price 函数 构建一个 256×256 的网格,其中 -2 ≤ x ≤ 2 且 -2 ≤ y ≤ 1:

¥The input values must be an array of length n×m where [n, m] is the contour generator’s size; furthermore, each values[i + jn] must represent the value at the position ⟨i, j⟩. For example, to construct a 256×256 grid for the Goldstein–Price function where -2 ≤ x ≤ 2 and -2 ≤ y ≤ 1:

js
var n = 256, m = 256, values = new Array(n * m);
for (var j = 0.5, k = 0; j < m; ++j) {
  for (var i = 0.5; i < n; ++i, ++k) {
    values[k] = goldsteinPrice(i / n * 4 - 2, 1 - j / m * 3);
  }
}
js
function goldsteinPrice(x, y) {
  return (1 + Math.pow(x + y + 1, 2) * (19 - 14 * x + 3 * x * x - 14 * y + 6 * x * x + 3 * y * y))

      * (30 + Math.pow(2 * x - 3 * y, 2) * (18 - 32 * x + 12 * x * x + 48 * y - 36 * x * y + 27 * y * y));
}

返回的几何对象通常传递给 geoPath 进行显示,并使用 null 或 geoIdentity 作为关联的投影。

¥The returned geometry objects are typically passed to geoPath to display, using null or geoIdentity as the associated projection.

contours.contour(values, threshold) {#contours_contour}

源代码 · 计算单个轮廓,返回 GeoJSON MultiPolygon 几何对象,表示输入大于或等于给定 阈值 的区域;每个几何对象的阈值以 geometry.value 的形式公开。

¥Source · Computes a single contour, returning a GeoJSON MultiPolygon geometry object representing the area where the input values are greater than or equal to the given threshold value; the threshold value for each geometry object is exposed as geometry.value.

输入值必须是长度为 n×m 的数组,其中 [n, m] 是轮廓生成器的 size;此外,每个 values[i + jn] 必须表示位置 ⟨i, j⟩ 处的值。请参阅 contours,了解示例。

¥The input values must be an array of length n×m where [n, m] is the contour generator’s size; furthermore, each values[i + jn] must represent the value at the position ⟨i, j⟩. See contours for an example.

contours.size(size) {#contours_size}

源代码 · 如果指定了 size,则将内部刻度大小设置为指定的值并返回轴。size 指定为数组 [n, m],其中 n 是网格的列数,m 是行数;n 和 m 必须是正整数。如果未指定大小,则返回当前大小,默认为 [1, 1]。

¥Source · If size is specified, sets the expected size of the input values grid to the contour generator and returns the contour generator. The size is specified as an array [n, m] where n is the number of columns in the grid and m is the number of rows; n and m must be positive integers. If size is not specified, returns the current size which defaults to [1, 1].

contours.smooth(smooth) {#contours_smooth}

示例 · 源代码 · 如果指定了 Smooth,则设置是否使用线性插值对生成的轮廓多边形进行平滑处理。如果未指定 Smooth,则返回当前平滑标志,默认为 true。

¥Examples · Source · If smooth is specified, sets whether or not the generated contour polygons are smoothed using linear interpolation. If smooth is not specified, returns the current smoothing flag, which defaults to true.

contours.thresholds(thresholds) {#contours_thresholds}

源代码 · 如果指定了 thresholds,则将阈值生成器设置为指定的函数或数组并返回此轮廓生成器。如果未指定阈值,则返回当前阈值生成器,默认情况下该生成器实现 Sturges 公式

¥Source · If thresholds is specified, sets the threshold generator to the specified function or array and returns this contour generator. If thresholds is not specified, returns the current threshold generator, which by default implements Sturges’ formula.

阈值定义为一个值数组 [x0, x1, …]。生成的第一个轮廓对应于输入值大于或等于 x0 的区域;第二条轮廓线对应的区域是输入值大于或等于 x1 的区域,依此类推。因此,对于每个指定的阈值,只会生成一个 MultiPolygon 几何对象;阈值以 geometry.value 的形式公开。

¥Thresholds are defined as an array of values [x0, x1, …]. The first generated contour corresponds to the area where the input values are greater than or equal to x0; the second contour corresponds to the area where the input values are greater than or equal to x1, and so on. Thus, there is exactly one generated MultiPolygon geometry object for each specified threshold value; the threshold value is exposed as geometry.value.

如果指定的是计数而不是阈值数组,则输入值的 extent 将被均匀划分为近似计数的区间;参见 ticks

¥If a count is specified instead of an array of thresholds, then the input values’ extent will be uniformly divided into approximately count bins; see ticks.