问

解释d3js投影基础知识

mobiledu2502912817 发布于 2023-02-13 21:31

我试图理解d3中地理投影的基础知识,这样我就可以有效地旋转,缩放和平移坐标.

投影的结果是否在默认的svg坐标系中,原点在左上方,正y值在网格中向下移动？或者结果是笛卡尔坐标,正y值向上移动？

我跑了这个测试.点a位于SF的西北部.点b位于SF的东南部.我期望点a的投影的x值更小(在左侧)的点b的投影.同样地,我预期点a的投影的y值小于(高于)点b的投影.

p = d3.geo.transverseMercator()
a = [-122.490402, 37.786453]
b = [-122.389809, 37.72728]
ap = p(a) // [359.30926341688723, -76.50496169565764]
bp = p(b) // [358.9636503828066, -76.46080714063936]

相反,指向a的投影x值大于b,因此a将在svg画布上的b下方结束.

[更新#1]

我一直在调查测试套件.在其中我看到了这些价值观:

(在albers-test.js中)

"San Francisco, CA": [[-122.42000000,   37.78000000], [ 107.44485839,  214.04820561]]

(在azimuthal-equal-area-test.js和其他几个)

"San Francisco, CA": [[ -46.16620803,   77.04946507], [ 448.09318291,   57.65281089]]

这告诉我,我很困惑.

为什么在测试中SF有2种不同的经度/纬度值？

我明显不喜欢杂草了.请帮我回到正轨.

-Kelly

1 个回答

啊,现在我已经调查过了,我可以看到你的坐标是正确的D3方向.我已经设置了这个bl.ock,为你绘制这些点.

如果您已经掌握了这一点,我深表歉意,但我会提供一些背景知识.投影的目的是将3D位置转换为2D平面(或屏幕).有许多不同的投影将3D坐标拉伸和弯曲到2D平面,确切地说这是如何实现投影设计师的预期结果.一些预测将更适合美国,Albers USA就是一个很好的例子,因为它将阿拉斯加和夏威夷移至加利福尼亚州西南部.对于一组给定的地球坐标,不同的投影将获得不同的屏幕坐标,这实际上是一种冗长的方式.要了解这一点,请查看Jason Davies 页面或Mike Bostock的这个bl.ock.

现在,您正在使用投影的正确路径,您只需设置D3将这些坐标转换为屏幕的方式.有很多方法可以做到这一点,但我在这里概述的是我最容易理解的方法.使用投影时可以设置许多参数,包括缩放,居中,平移,旋转等.他们所做的是相当紧张的前进.比例设置缩放的数字越大,地图的放大越多,中心设置坐标的地图中心点,翻译将地图的中心发送到屏幕位置,旋转旋转地图.

在我设置的bl.ock中,我刚刚使用了scale和center参数,如:
```
projection
  .scale(1000)
  .center([-106, 37.5])
```
要确切了解其工作原理如何改变这些参数,请尝试增加比例,以便您可以将点设置在哪里,并记住将中心设置为其中一个点以确保您可以看到它们.
2023-02-13 21:36 回答

青春快乐的勇哥

撰写答案

今天，你开发时遇到什么问题呢？

立即提问

热门标签