使用d3.js在地图上绘制投影矩形

时间:2013-11-11 23:58:59

标签: javascript svg d3.js map-projections

这是使用 d3.js 在地图上绘制投影矩形的最优雅方式?

此解决方案适用于圈子

   var circ = d3.geo.circle();

    var circle = g.selectAll("path1")
        .data(dataset)

    circle.enter()
      .append("path")
        .attr("class", "point")
        .datum(function(d) {
            return circ
                .origin([d.x, d.y])
                .angle(3)()
        })
        .attr("d", path)

在“Circle clip and projection with D3 orthographic”中解释

无论如何,显然没有d3.geo.rect(),我真的无法弄清楚哪个是d3.geo.path()想要操作的正确输入。

我们以这组坐标为例:

    var route = {
        type: "LineString",
        coordinates: [
            [0,0],
            [0,60],
            [60,60],
            [60,0],
        ]
    }

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

导致这个投影矩形: enter image description here

您可以看到上面的线是弯曲的,不遵循投影。它听起来很直接,因为它遵循一个测地线(平行线的定义与经络不同),但那么如何定义一条平行线之后的线?

非常感谢你的帮助!

0 个答案:

没有答案