d3.geo.path奇怪的大边界

时间:2015-11-08 18:33:35

标签: d3.js d3.geo

有人可以向我解释以下情况吗?

假设我有一个GeoJSON文件,其中一个Polygon功能只包含四个坐标:

var json = {
  "type": "FeatureCollection", 
  "features": [
    {
      "geometry": {
        "type": "Polygon", 
        "coordinates": [
          [
            [
              6.55757, 
              45.4283625
            ], 
            [
              6.50925565, 
              45.3728949
            ], 
            [
              6.5249137, 
              45.3728329
            ], 
            [
              6.52511385, 
              45.37276325
            ]
          ]
        ]
      }, 
      "type": "Feature", 
      "properties": {
        "uid": "fb3f3081-c6cf-4f64-8ccb-67918a3dbe84"
      }
    }
  ]
}

现在我想将此项目投射到mercator并获取边界框:

var projection = d3.geo.mercator()
.scale(1)
.precision(0);

var path = d3.geo.path()
.projection(projection);

var pathBounds = path.bounds(json.features[0]);
var geoBounds = d3.geo.bounds(json.features[0]);

json.features[0].geometry.coordinates[0].map(function(d) {
    console.log("projection:", projection(d)[0], projection(d)[1]);
});

console.log('path.bounds:', pathBounds[0][0], pathBounds[0][1])
console.log('path.bounds:', pathBounds[1][0], pathBounds[1][1])

console.log('d3.geo.bounds:', geoBounds[0][0], geoBounds[0][1])
console.log('d3.geo.bounds:', geoBounds[1][0], geoBounds[1][1])

结果不太直观。路径的边界框比任何投影点都大,地理边界框为[[-180,-90],[180,90]]

看起来多边形被解释为多边形的整个世界外部。这是预期的吗?为什么这样做而不是将多边形视为列出的点内的区域?

小提琴(打开调试器以查看控制台日志):

https://jsfiddle.net/pkerpedjiev/emr2g4f8/

1 个答案:

答案 0 :(得分:3)

documentation说:

  

重要提示:多边形内部是多边形以顺时针顺序缠绕的所有点。

如果您颠倒了积分的顺序,它应该可以正常工作。