d3

时间:2016-12-22 12:10:24

标签: javascript d3.js projection map-projections

我正在尝试在我的祖国奥地利的SVG地图上投射一组点([long,lat]元组):

https://commons.wikimedia.org/wiki/File:Austria-geographic_map-blank.svg

维基媒体上SVG文件的描述给出了投影名称和地图的边界:

  

Lambert Conformal Conic,WGS84数据
  地图的地理限制:

     西:17.2°W
  东:9.3°W
  北:49.2°N
  南部:46.0​​°N

像我一样天真,我认为这些信息足以用D3创建正确的投影。

这是我先试过的:

    let gcc = d3.geoConicConformal()
        .fitSize([width, height], bbox)

其中bbox是一个GeoJSON多边形,表示上面给出的地图边界。

不幸的是结果不正确:

enter image description here

现在,通过阅读D3文档,我可以猜测我必须为投影指定更多参数,例如两个标准并行。不幸的是,我不知道它们是什么,并且在地图的西部和东部边界周围尝试各种值不起作用。我认为它们可以源自我对地图的了解,或者可能不是?

其次,让我感到困惑的是投影不仅错误地旋转,而且错误地缩放 - 我认为使用.fitSize会照顾到它。

任何人都可以给我任何关于正确设置Lambert圆锥形共形投影的指示吗?

1 个答案:

答案 0 :(得分:4)

Fitsize将正确地平移和缩放地图,但是,您需要旋转圆锥投影,并且如您所述,设置平行线。

<强>平行

奥地利Lambert Conic Conformal地图投影有一个记录,其规格可以找到herehere。在这种情况下,可能正确的相似之处是[46,49],尽管您使用的地图可能是自定义投影。

轮换

现在您需要按经度沿x轴旋转地图。圆锥曲线图通常沿x轴旋转,并以y轴为中心(请参阅我的答案here,以获得图形说明原因(以及平行线如何改变投影))

旋转移动世界,使您感兴趣的区域正确对齐,使地图的中央子午线在地图中垂直。根据上面提到的投影规格,中央子午线应该在13度,20分钟(13.333度),尽管两个参考之间存在很小的不一致。沿x轴的旋转设置为该值的负值。

使用这些参数:

d3.geoConicConformal()
    .parallels([46,49])
    .rotate([-13.333,0])
    .fitSize([width,height],bbox)

我非常适合我的下采样goto世界topojson:

enter image description here

svg图像可能使用的参数与发布的参数(舍入,拼写错误)略有不同,或者是自定义选择的并行数据;但是,这应该是相当紧密的。