Question

我正在尝试在d3.js中的OpenStreetMap磁贴上绘制运行路径，这在我显示＆lt;时不是问题。一次1000个，但我有超过100,000个路线。由于不是所有的路线都在同一个地理位置，我想只显示一次在伦敦大都市区的路线。

我遇到的问题是在地图上显示之前进行过滤，即在给定定义的投影和路径的情况下找到路线的边界框;寻找路线质心;然后查看投影是否包含路径质心。我一直在搜索d3.js文档，但一直无法使用它;有没有人对如何最好地解决这个问题有任何建议？

// Sample projection and tile code for London
var projection = d3.geo.mercator()
    .center([0.1275, 51.5072])
    .scale((1 << 20) / 2 / Math.PI)
    .translate([960 / 2, 500 / 2]);
var tiler = d3.geo.tile()
    .size([960, 500]);
var tilerData = tiler
    .scale(projection.scale() * 2 * Math.PI)
    .translate(projection([0, 0]));
var path = d3.geo.path()
    .projection(projection);

// Data read in from CSV file - [id, date, encoded_poly]
d3.csv('data/gpsdata.csv', function (d) {

    // Is there a way to filter out the routes that are displayed on the visible map?

    var mapBounds = tilerData.getBounds();
    var filteredData = d.filter(function(e){
        var x = {type: "LineString", coordinates: decode(e.encPoly)};
        return mapBounds.contains(path(x).getBounds().getCenter());
});

非常感谢任何帮助......谢谢！

d3仅显示地图边界内的线串

0 个答案: