使用D3.js geom缩放voronoi多边形,结果为lat long,而不是px中的坐标

时间:2017-05-30 02:00:45

标签: javascript d3.js polygons geography voronoi

我正在尝试为lat / long中的一组输入点创建voronoi多边形。问题是我的输入数据集可以在同一位置包含多个点,因此返回相同的voronoi多边形。

我想直观地显示重叠的多边形(每个多边形略小于前一个),以证明在同一点上有多个多边形,如下面的屏幕截图所示。

通过阅读文档,您似乎可以缩放投影,但这些投影已经在px中,而不是我的真实纬度/长值。

那么,如何在lat / long中获取输入多边形并返回一个缩小X%的多边形,使用d3.js-v3输出多边形为lat / long?

示例多边形输入:[long1,lat1,long2,lat2,long3,lat3,long4,lat4]

concentric polygons

编辑:上面的图像使用“剪辑”功能剪切多边形,剪切半径越来越小,这为边缘多边形提供了所需的效果,但是没有达到内部绑定多边形的预期效果。

1 个答案:

答案 0 :(得分:0)

所以解决方案最终很容易。

var p1 = d3.geom.polygon(polygonArray);
var centroid = p1.centroid();
var newPolygonArray = [];
p1.forEach(function(v, i) {  
    var newLong = centroid[0] + (v[0] - centroid[0])*(0.9);
    var newLat = centroid[1] + (v[1] - centroid[1])*(0.9);
    newPolygonArray.push(newLong, newLat);
}.bind(this));

我花了很长时间尝试使用d3函数和投影来转换,平移和缩放多边形,但是当我离开那天工作时,我发现我需要做的就是上面的简单数学过程。 / p>

教训是当你被困住时休息,新鲜空气可以睁开你的眼睛。

concentric voronoi polygons