D3

d3-geo ​

地图投影有时以点变换的形式实现：一个函数，该函数接受给定的经度 lambda 和纬度 phi，并返回平面上相应的 xy 位置。例如，这是球面墨卡托投影（以弧度为单位）：

¥Map projections are sometimes implemented as point transformations: a function that takes a given longitude lambda and latitude phi, and returns the corresponding xy position on the plane. For instance, here is the spherical Mercator projection (in radians):

js
function mercator(lambda, phi) {
  const x = lambda;
  const y = Math.log(Math.tan(Math.PI / 4 + phi / 2));
  return [x, y];
}

如果你的几何图形仅由点组成，则这是一种合理的方法。但是，对于多边形和折线等离散几何体呢？

¥This is a reasonable approach if your geometry consists only of points. But what about discrete geometry such as polygons and polylines?

离散几何在从球面投影到平面时带来了新的挑战。球形多边形的边是 geodesics（大圆的线段），而不是直线。除 gnomonic 外，所有地图投影中的测地线都会变成曲线，因此精确的投影需要沿着每条弧进行插值。D3 使用受 Visvalingam 的线简化方法 启发的 自适应采样 来平衡精度和性能。

¥Discrete geometry introduces new challenges when projecting from the sphere to the plane. The edges of a spherical polygon are geodesics (segments of great circles), not straight lines. Geodesics become curves in all map projections except gnomonic, and thus accurate projection requires interpolation along each arc. D3 uses adaptive sampling inspired by Visvalingam’s line simplification method to balance accuracy and performance.

多边形和折线的投影还必须处理球体和平面之间的拓扑差异。某些投影需要切割 跨越对向子午线 的几何体，而其他投影则需要 将几何图形裁剪为大圆。球形多边形也需要 缠绕顺序约定 来确定多边形的哪一侧是内侧：小于半球的多边形的外环必须顺时针旋转，而 大于半球 多边形的外环必须逆时针旋转。表示孔洞的内部环必须使用与其外部环相反的环绕顺序。

¥The projection of polygons and polylines must also deal with the topological differences between the sphere and the plane. Some projections require cutting geometry that crosses the antimeridian, while others require clipping geometry to a great circle. Spherical polygons also require a winding order convention to determine which side of the polygon is the inside: the exterior ring for polygons smaller than a hemisphere must be clockwise, while the exterior ring for polygons larger than a hemisphere must be anticlockwise. Interior rings representing holes must use the opposite winding order of their exterior ring.

D3 使用球形 GeoJSON 在 JavaScript 中表示地理特性。D3 支持各种 common 和 unusual 地图投影。由于 D3 使用球面几何来表示数据，因此你可以通过旋转几何体将任何方位应用于任何投影。

¥D3 uses spherical GeoJSON to represent geographic features in JavaScript. D3 supports a wide variety of common and unusual map projections. And because D3 uses spherical geometry to represent data, you can apply any aspect to any projection by rotating geometry.

请参阅以下之一：

¥See one of:

  • 路径 - 从 GeoJSON 生成 SVG 路径数据

    ¥Paths - generate SVG path data from GeoJSON

  • 投影 - 将球面几何体投影到平面

    ¥Projections - project spherical geometry to the plane

  • 流 - 变换（球面或平面）几何体

    ¥Streams - transform (either spherical or planar) geometry

  • 形状 - 生成圆、线和其他球面几何体

    ¥Shapes - generate circles, lines, and other spherical geometry

  • 球面数学 - 球面几何的低级方法

    ¥Spherical math - low-level methods for spherical geometry

提示

要将 Shapefile 转换为 GeoJSON，请使用 shp2json（shapefile 包 的一部分）。请参阅 命令行制图，了解 d3-geo 及其相关工具的介绍。另请参阅 TopoJSON，它是 GeoJSON 的一个扩展，它更加紧凑，并包含拓扑结构。

¥To convert shapefiles to GeoJSON, use shp2json, part of the shapefile package. See Command-Line Cartography for an introduction to d3-geo and related tools. See also TopoJSON, an extension of GeoJSON that is significantly more compact and encodes topology.

CAUTION

TopoJSON 和 ESRI Shapefile 也使用 D3 的环绕顺序约定；但是，这与 GeoJSON 的 RFC 7946 的约定相反。另请注意，标准 GeoJSON WGS84 使用平面等矩形坐标，而非球面坐标，因此可能需要 stitching 移除对向子午线切割。

¥D3’s winding order convention is also used by TopoJSON and ESRI shapefiles; however, it is the opposite convention of GeoJSON’s RFC 7946. Also note that standard GeoJSON WGS84 uses planar equirectangular coordinates, not spherical coordinates, and thus may require stitching to remove antimeridian cuts.