D3.js 如何集中精力,；d3js中的比例贴图（使用投影。居中/平移/旋转？）

假设我有给定地理特征和特定投影的数据

我应该如何居中并缩放贴图以适合其父对象

似乎我可以使用projection.rotate（）、projection.translate（）或projection.center（）使地图居中：

---

有什么不同？缩放如何影响不同的功能？

实际上，它是两者的混合体。根据API，projection.center：

将投影的中心设置为指定位置（以度为单位的经度和纬度的两元素数组），并返回投影

因此，它用于设置地图的中心。关于projection.translate：

如果指定了“点”，则将投影的平移偏移设置为指定的两元素数组[x，y]，并返回投影。如果未指定点，则返回默认为[480，250]的当前平移偏移量。平移偏移确定投影中心的像素坐标。默认的平移偏移位置⟨0°,0°⟩ 位于960×500区域的中心

如您所见，projection.translate依赖于projection.center（“平移偏移确定投影中心的像素坐标”）。因此，这两个值都将确定贴图在其容器中的位置

这是一个演示，用一个较小的SVG 500x500显示日本地图（此代码不是我的）。在本例中，我们将把translate设置为SVG的中间部分：

.translate([width/2, height/2]);

查看演示：

var topoJsonUrl=”https://dl.dropboxusercontent.com/u/1662536/topojson/japan.topo.json";
可变宽度=500，
高度=500，
比例=1；
d3.选择（“正文”）.附加（“svg”）
.attr（“宽度”，宽度）
.attr（“高度”，高度）
.附加（“g”）.attr（“id”、“all-g”）；
var projection=d3.geo.mercator（）
.center（[138,38]）
.比例尺（1000）
.翻译（[宽度/2，高度/2]）；
json（topoJsonUrl，onload映射）；
函数onLoadMap（错误，jpn）{
var path=d3.geo.path（）
.投影（投影）；
var features=topojson.object（jpn，jpn.objects.japan）；
var-mapJapan=特征；
d3.选择（“全部g”）
.append（“g”）.attr（“id”，“path-g”）.selectAll（“path”）
.数据（特征.几何）
.输入（）
.append（“路径”）
.attr（“填充”，“#f0”）
.attr（“id”，函数（d，i）{return“path”+i}）
.attr（“笔划”，“999”）
.attr（“笔划宽度”，0.5/刻度）
.attr（“d”，路径）；
}

路径{
笔画：黑色；
笔画宽度：1.5；
}

---

在v4中使用

projection.fitExtent（）

fitExtent

采用两个参数：

范围是投影的左上角和右下角，由两个数组组成的数组表示–例如，

[[0,0]，[width，height]]

对象是GeoJSON对象

---

如果投影的左上角是

[0,0]

，则可以使用方便的方法

projection.fitSize（）

，其中您只通过

范围的右下角，由两个项目组成的单个数组表示–例如
[width，height]
，因此projection.center将地图移动到[lat，long]空间和投影。平移在投影的[x，y]空间中移动地图？确定。那么，如何使投影贴图填充父容器呢？我用d3.0刻度吗？d3.scale在地图空间或投影平面中起作用吗？很遗憾，这些示例不再起作用，因为它们所基于的Dropbox内容不再可用。下次最好使用GitHub Gist/bl.ocks.org！