Javascript 在d3中缩放投影意味着什么?

Javascript 在d3中缩放投影意味着什么?,javascript,d3.js,Javascript,D3.js,我知道在D3中,刻度是从输入数据值(域)到输出数据值(范围)的数学映射。我知道我可以设置一个比例,将输入从域映射到一个范围,如下所示: var scale = d3.scale.linear().domain([100, 500]) .range([10, 350]); scale(100); //Returns 10 .attr("cx", function(d) { return scale(d[0]); //Returns scaled value }) 我知道,一旦设置了比例,就可以

我知道在D3中,刻度是从输入数据值(域)到输出数据值(范围)的数学映射。我知道我可以设置一个比例,将输入从域映射到一个范围,如下所示:

var scale = d3.scale.linear().domain([100, 500])
.range([10, 350]);
scale(100); //Returns 10
.attr("cx", function(d) {
return scale(d[0]); //Returns scaled value
})
我知道,一旦设置了比例,就可以使用它来缩放属性,如下所示:

var scale = d3.scale.linear().domain([100, 500])
.range([10, 350]);
scale(100); //Returns 10
.attr("cx", function(d) {
return scale(d[0]); //Returns scaled value
})
然而,在博斯托克量表上,使用的方式有点不同。Bostock根据墨卡托投影返回的结果调用scale:

var projection = d3.geo.mercator()
    .scale(500)
    .translate([width / 2, height / 2]);
我正试图理解这行代码,但遇到了一点小麻烦
mercator()
返回一些----然后对该对象调用
scale
方法,输入值为500

在这样的投影上称“比例”是什么意思?这与scale()的关系如何,这是一种将100转换为10的方法——如上面的示例所示

更直接的是,如果我将其添加到代码中,我的geojson映射就会消失!如何使其正确缩放

var projection = d3.geo.mercator()
    .scale(500)
    .translate([width / 2, height / 2]);

var path = d3.geo.path()
    .projection(projection); //if I add this little bit to the path, my map disappears!

下面是我正在使用的GeoJSON:

在本例中,scale是在一般意义上的某物大小中使用的。它与d3缩放函数没有直接关系,但与您可以应用于SVG元素以使其变大或变小的参数有关。但是,它不是缩放平面图形,而是缩放复杂的投影

d3.geo.mercator()返回的投影是一个函数。具体来说,它是一个将经度/纬度点转换为x/y点的函数

类似地,
d3.geo.path()
返回的函数将GeoJSON数据转换为SVG路径定义。当通过指定特定的投影函数来指定“修改此函数”时,该函数将使用该投影计算其创建的路径上每个点的位置

现在,当您将缩放投影指定给路径时,为什么看不到任何东西?很可能是因为你被放大到什么都看不见:你迷失在空旷的海洋中。投影上的默认比例因子为150,因此500的比例放大了三倍以上。尝试不同的比例因子,一些大于150,一些小于150,以放大和缩小地图


当然,翻译也可能会从你的地图上消失。设置地图中心(纬度/经度)点的x/y值。如果未指定要用作投影的对象,则投影将使用0度纬度和0度经度。如果您试图绘制的地理位置与该点(位于中)相去甚远,则除非您大幅缩小(即使用非常小的比例数字),否则将再次显示任何内容。

也许您可以解释如何计算,而不是猜测比例应该是什么。假设我要缩放路径,使其边界框在中居中,并使边界框的高度为div高度的1/2。这将非常有助于理解。Hi@subsci。不幸的是,没有简单的公式:您需要测试、测量,然后纠正。对于每个地图投影,“比例”值的工作方式不同。