半径以迈尔斯为单位的D3托波逊圆

Question

(假设现有投影/topojson)

我想做的是在半径(r)的一点(长，拉)上创建一个圆(R)，以英里为单位。我知道这里有一个d3.geo函数，但是经过一些考虑后，我不认为它将与我的特定应用程序非常兼容。

现在我正在寻找一个本地的svg circle解决方案，其中cx和cy是lat和long，r是半径(以英里为单位)。我知道cx和cy，但我不知道如何确定r是15英里。因此，最主要的是如何确保半径在像素空间绘制时以英里为单位。必须有办法使用projection函数为半径设置适当的标度。但我还没在实践中见过这个。

此外，我还应该指出，我的投影是动态的，取决于用户事件的投影(包括缩放)可能发生的变化。因此，我不确定这是否会影响到在现有投影的范围内如何缩放圆圈，但我想，为了安全起见，我会披露这一点。

Answer 1

为什么不使用内置的圆生成器d3.geoCircle()？

返回“多边形”类型的新GeoJSON几何对象，该对象与当前的居中、半径和精密度近似为球面上的一个圆。任何参数都会传递给访问器。

剩下的唯一任务就是计算圆周的半径(以度为单位)。因为地球不是一个完美的球体，这本身就会成为相当大的挑战。但对于许多应用程序来说，近似就足够了。仅考虑到3,958英里的平均半径，计算可以写成：

var EARTH_RADIUS = 3959;                         // mean radius in miles
var radiusMi     = 5;                            // radius to be drawn in miles
var radiusDeg    = radiusMi / EARTH_RADIUS * 90; // radius in degrees for circle generator

然后，可以将它传递给圆圈生成器：

var circle = d3.geoCircle().radius(radiusDeg);

最后，圆圈生成器用于通过数据绑定将其输出传递到适当的路径生成器，同时考虑到投影：

svg.append("path")
  .datum(circle)
    .attr("d", path);

看看这个区块，它的特征是半径50英里的圆圈，每个圆圈位于世界各地的不同位置。圆发生器与投影相结合，可以控制圆的正确大小和形状。

​

​

D3 v3

如果您仍然坚持使用D3 v3，那么这个示例也可以工作。但是，您需要相应地调整名字：

• d3.geo.circle↦d3.geoCircle

此外，圆生成器的一些方法被重命名为：

• circle.origin()↦circle.center() .
• circle.angle()↦circle.radius() .

将这些调整应用于我的上述链接块，这同样适用于v3：v3块。

当涉及到具有严重扭曲现象的异常预测时，这种方法就会发挥其优势。只要将块中的投影更改为d3.geoGnomonic()，就很容易看到。更新后的区块截图仍然显示相同的圆圈，每个圆圈的半径为50英里：

​

​