在d3.geo中如何改变LineString段的路径

时间:2014-03-28 07:53:48

标签: d3.js geo

我在地图上绘制了一些货运路线的路径,使用naturalearth的geojson作为地图和mercator作为投影。当两条路线重叠时,如何将它们稍微分开?

我碰巧有几批货物在路径上有一些重叠。例如,Chicago->Memphis->MiamiChicago->Memphis->Atlanta。我正在分别绘制每个段(例如Chicago->Memphis),因为我想对LineString进行颜色编码。

由于路径段重叠,一个覆盖另一个路径段,结果显示不太通信。我想要的是所绘制的路径略有变化(就像在航空杂志中看到的那样,它们在相同的目的地点之间显示多个航班)。鉴于我选择了一个特定的投影,这可能吗?我怎么能以不同的方式编码?实际地理路线的保真度并不是那么重要,因为铁路,卡车或飞机无论如何都很少沿着最短的路径行驶。

我生成的线段为:

results.segments = _.reduce(results.points, function (acc, v, i, raw) {
    if (i) {
        acc.push({
            feature: {
                type: "LineString",
                coordinates: [
                    [raw[i - 1].LONGITUDE, raw[i - 1].LATITUDE],
                    [raw[i].LONGITUDE, raw[i].LATITUDE]
                ]
            },
            segment_delayed: raw[i].arrived_late
        })
    }
    return acc;
}, []);

然后显示为:

route.selectAll("path")
    .data(results.segments)
    .enter()
    .append("path")
    .attr("d", function (d) {
        return path(d.feature);
    })
    .attr("stroke", function(d) {
        return d.segment_delayed ? "red" : "black";
    })

非常感谢。

0 个答案:

没有答案