Question

我在d3上关注本教程：

在其中，我看到了这段代码：

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

同样是路径生成器：

var path = d3.geo.path()
    .projection(projection);

这些方法到底在做什么？这些d3方法有很好的文档吗？关于d3文档。它说：

＆＃34;＃d3.geo.mercator（）

＆＃34;球形墨卡托投影通常用于平铺贴图库（例如OpenLayers和Leaflet）。显示示例使用墨卡托投影的光栅图块，请参阅d3.geo.tile插件。它是保形的;然而，它引入了严重的区域失真世界范围因此不建议用于等值区。＆＃34;

d3.geo.mercator只是一种地图设计吗？

Answer 1

地图投影只是将一个系统中的点（基于球体/椭圆体的纬度/经度）转换为另一个系统（具有x / y值的2d笛卡尔平面）。

墨卡托是这样做的一种（很常见）方式。有关地图投影的更多信息，请查看http://en.wikipedia.org/wiki/Map_projection。

使用您发布的代码，它会设置一个墨卡托投影，当传递[long, lat]点时，它将返回一个[x, y]点，该点对应于x和y位置在svg或canvas上绘制。在这种情况下，它将以[width/2, height/2]为中心。

路径生成器是d3＆＃34;魔法＆＃34;将点列表转换为svg path字符串。 svg拥有自己的＆＃34;语言＆＃34;对于路径，您可以在http://www.w3.org/TR/SVG/paths.html找到更多信息，但这确实非常技术性。

由于svg在像素坐标中进行说明，并且大多数地理数据都以纬度/经度为参考，因此投影功能可让您轻松地从一个转换为另一个并再返回。

由于在地图上绘制路径是一项非常常见的活动，d3包括投影＆＃34;意识到的路径生成器＆＃34;并将自动将指定的投影应用于您传递给路径生成器的任何数据，这将导致返回像素坐标，然后将其转换为path＆＃34;语言＆＃34;如上所述，然后可以在svg元素上显示。