问题是 fitSize 采用 geojsonobject而 selectAll.data() 需要一个array,您正在使用这两个之一geoData
。这留下了两个解决方案:
解决方案一:
如果我们使用
var geoData = topojson.feature(mapData, mapData.objects["cb_2015_new_york_county_20m"]).features
var projection = d3.geoMercator()
.fitSize([width, height], geoData)
我们收到 NaN 错误是因为投影设置不正确,因为我们没有传递 geojson 对象,而只是传递 geojson 对象数组。我们可以通过创建一个特征集合来解决这个问题geoData
并将其传递给 fitSize:
var geoData = topojson.feature(mapData, mapData.objects["cb_2015_new_york_county_20m"]).features
var projection = d3.geoMercator()
.fitSize([width, height], {type:"FeatureCollection", features: geoData})
现在我们将 geojson 特征集合传递给 fitSize,我们都进行投影,并且因为geoData
仍然是一个数组,我们可以将其不变地传递给 selectAll.data() 。
这是一个块。
解决方案2:
如果我们使用:
var geoData = topojson.feature(mapData, {
type:"GeometryCollection",
geometries: mapData.objects["cb_2015_new_york_county_20m"].geometries,
})
我们得到一个 geojson 对象,projection.fitSize 可以工作,但是selectAll().data(geoData)
不添加任何功能,因为它不是数组 - 输入选择为空。我们可以代入selectAll().data(geoData.features)
为了解决这个问题并为每个功能输入一个路径(或者我们可以使用.data([geoData])
为所有路径输入一项要素)。
这是一个块。
两个块都以正确的比例绘制 - 地图超出了块边界,因为我没有改变您的 800x800 尺寸