在d3中缩放投影是什么意思? [英] What does it mean to scale a projection in d3?

查看:266
本文介绍了在d3中缩放投影是什么意思?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

I know that in D3, scales are mathematical maps from input data values (domain) to output data values (range). I know that I can set up a scale that will map input from the domain onto a range, like this:

var scale = d3.scale.linear().domain([100, 500])
.range([10, 350]);
scale(100); //Returns 10



我知道一旦你设置了一个比例,你可以使用它来缩放属性,像这样:

I know that once you setup a scale, you can use it to scale attributes, like this:

.attr("cx", function(d) {
return scale(d[0]); //Returns scaled value
})

http://bost.ocks.org/mike/map/ =nofollow>地图绘制教程比例稍有不同。 Bostock调用比例因为mercator投影返回的任何内容:

However, on Bostock's mapping tutorial scale is used a little differently. Bostock calls scale on whatever is returned by the mercator projection:

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

我试图理解这行代码并有点麻烦。 mercator()返回一些内容 - 从API不是很清楚 - 然后在输入值为500的那个对象上调用 scale 方法。

I am trying to understand that line of code and having a little trouble. mercator() returns something -- which is not so clear from the API -- and then the scale method is called on that object with an input value of 500.

在这样的投影上调用scale是什么意思?这是如何与scale()作为一种方式来转换100在10 - 如上例中。

What does it mean to call "scale" on a projection like this? How does this relate to scale() as a way to transform 100 in 10 -- as in the example above.

更快地,如果我将它添加到我的代码,我的geojson地图消失!如何使其缩放正常?

More immediately, if I add this to my code, my geojson map disappears! How do I make it scale properly?

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: http://geojson.io/#id=gist:AbeHandler/9d28239c592c6b552212&map=10/29.9912/-89.9320

Here is the GeoJSON I am using: http://geojson.io/#id=gist:AbeHandler/9d28239c592c6b552212&map=10/29.9912/-89.9320

推荐答案

在这种情况下,缩放用于一般意义上的大小。它与d3比例函数没有直接关系,但与相关缩放变换,您可以应用于SVG元素以使其变大或变小。

In this case, scale is used in the general sense of the size of something. It's not directly related to the d3 scale functions, but is related to the scale transforms you can apply to an SVG element to make it bigger or smaller. However, instead of scaling a flat drawing, it scales the complex projection.

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

The projection returned by d3.geo.mercator() is a function. Specifically, it's a function that converts from a longitude/latitude point to an x/y point.

同样, d3.geo.path()返回的函数将GeoJSON数据转换为SVG路径定义。当您通过为该函数分配一个特定的投影函数来指定修改此函数时,它将使用该投影来计算它创建的路径上每个点的位置。

Similarly, the function returned by d3.geo.path() converts GeoJSON data into SVG path definitions. When you assign a modify this function by assigning it a specific projection function, it will use that projection to figure out the position of each point on the path it creates.

,当你为你的路径分配一个放大的投影时,为什么你看不到任何东西?这可能是因为你是如此放大,没有什么可看到:你失去了空海。投影上的默认比例因子为150,因此500的比例是放大的三倍以上。尝试使用不同的比例因子(一些比较大,一些小于150)来放大和缩小地图。

Now, why are you not seeing anything at all when you assign a scaled-up projection to your path? It is probably simply that you are so zoomed-in that there is nothing to see: you're lost in empty ocean. The default scale factor on a projection is 150, so a scale of 500 is more than three times zoomed in. Try different scale factors, some bigger and some smaller than 150, to zoom in and out of the map.

当然,翻译也可能会抛弃你的地图。 翻译参数会设置中心的x / y值(纬度/经度)点。如果您未指定要用作中心点的内容, a>,投影使用0度纬度和0度经度。如果您尝试绘制的地理位置不在该点附近(位于加纳海岸以外的几内亚湾a>),然后再次没有什么会出现,除非你大幅缩小(即,使用非常小的数字)。

Of course, the translation could also be throwing off your map. The translation parameter sets the x/y value for the center (latitude/longitude) point of your map. If you don't specify what you want to use as a center point, the projection uses 0 degrees latitude and 0 degrees longitude. If the geography you're trying to draw is nowhere near that point (which is in the Gulf of Guinea, off the coast of Ghana), then once again nothing is going to show up unless you zoom out considerably (i.e., use a very small scale number).

这篇关于在d3中缩放投影是什么意思?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆