D3.js 地理投影投影整个地球

Question

我刚刚使用 D3.js 地理投影来创建国家地图。然而，这个投影似乎投影了整个国家和整个地球。从下图中，我们可以看到一个清晰的边界，表示(-180, -90) -> (180, 90)（纬度和经度）。 我刚刚为 d3.js 地图编写了最简单的代码：

const projection = d3.geoEquirectangular();
projection.fitSize([width, height], data);
const path = d3.geoPath().projection(projection);

我确信我的 .geojson 文件仅包含单个国家/地区的多多边形。积分不超过国家，即我在 (180, 90) 处没有积分。

我不知道为什么 d3.js 为我添加了整个地球边界。我只想让单个国家/地区适合 SVG 大小。

我对一个省使用相同的代码，它正确地适合没有边界的 SVG。请参见下图。

Answer 1

fitSize

（以及相关的

fitExtent

）将投影映射到 output 空间，即屏幕上的矩形。在您的示例中，您已将投影的渲染放入尺寸为

<div>

的盒子（例如，

<svg>

或

[width, height]

）中，但实际上并未修改投影。为此，您可能需要类似

projection.center([lat, lon]).scale(scale)

的东西。