Geojson/ turf :将多个多边形合并到一个保留洞的多边形中

use*_*293 7 polygon geojson leaflet turfjs

所以我想在 javascript 中合并相邻的多边形,这就是我在代码中实际拥有的:

地图

我想删除内部描边但保留边框描边。

所以我想从这里开始:

地图2

对此:

地图3

我想保留巴黎的洞 - 我可以定义哪些多边形必须分组,但我无法将它们与以下代码合并:

var map = L.map('map', {
    center: [46.52863469527167, 2.43896484375],
    zoom: 6,
    maxZoom: 18,
    minZoom: 7
});
$http.get("france.json").then(function (response) {
    $scope.communeFr = response.data.features
    $http.get(apiult).then(function (response) {
        $scope.showCommune = response.data.Liste
        $scope.communeFr.map(x => {
            x.show = false
            for (let i = 0; i < $scope.showCommune .length; i++) {
                if (x.properties.insee == $scope.showCommune[i].insee) {
                    x.show = true
                    return
                }
            }                
        })
        L.geoJson($scope.communeFr, {
            filter: function (feature, latlng) {
                return feature.show 
            }
        }).addTo(map);
    });
    
});
Run Code Online (Sandbox Code Playgroud)

更新 - 我尝试过,turf.union但输出不正确:

地图4

这是我的代码

var GroupPolygons = [];    
$scope.communeFr.map(x => {
    x.show = false
    for (let i = 0; i < $scope.showCommune .length; i++) {
        if (x.properties.insee == $scope.showCommune[i].insee) {
            GroupPolygons.push(x)
        }
    }                
})
var union = turf.union(...GroupPolygons)
L.geoJson(union).addTo(map)
Run Code Online (Sandbox Code Playgroud)

Rob*_*zie 13

union草皮文档中关于可以作为参数传递的多边形数量似乎存在歧义。请参阅此处此处。看起来一次必须有两个 - 所以这会起作用:

// feature ids to remove e.g. central Paris
var removeIds = [868, 869, 870, 871, 872, 873, 874, 875, 876, 877, 878, 879, 880, 881, 882, 883, 884, 885, 886, 887];

// filter features to remove central Paris
var hole = fc.features.filter(f => !removeIds.includes(f.properties.ID_APUR))

// do the union over each feature
var union = hole[0];
for (let i=1; i<hole.length; i++) {
  union = turf.union(union, hole[i]);
}
Run Code Online (Sandbox Code Playgroud)

我选择了巴黎市中心的一堆要删除的区域,然后从剩余的特征中,我从特征 0 开始,然后是turf.join所有其他特征(从索引 1 开始)到这个特征。看起来效率低下但有效...

这里有一个小问题:

// new Feature collection with unioned features
var fc2 = {
  "type": "FeatureCollection",
  "features": [union] // note features has to be an array
}
Run Code Online (Sandbox Code Playgroud)

请记住传递一个FeatureCollection,L.geoJson并且该features属性必须是一个数组 - 即使在这种情况下它包含合并区域的单个特征。

工作示例:

// feature ids to remove e.g. central Paris
var removeIds = [868, 869, 870, 871, 872, 873, 874, 875, 876, 877, 878, 879, 880, 881, 882, 883, 884, 885, 886, 887];

// filter features to remove central Paris
var hole = fc.features.filter(f => !removeIds.includes(f.properties.ID_APUR))

// do the union over each feature
var union = hole[0];
for (let i=1; i<hole.length; i++) {
  union = turf.union(union, hole[i]);
}
Run Code Online (Sandbox Code Playgroud)
// new Feature collection with unioned features
var fc2 = {
  "type": "FeatureCollection",
  "features": [union] // note features has to be an array
}
Run Code Online (Sandbox Code Playgroud)
// center map on Paris
var map = L.map('mapid', {
    center: [48.856, 2.352],
    zoom: 9,
    maxZoom: 18,
    minZoom: 1
});

// add tiles
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
    attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);

var url = "https://gist.githubusercontent.com/robinmackenzie/937e5bd42a0412c21281f69b8f0c8614/raw/fbed7c2783366463a250e4bb0ebcf3c5f6d54dfe/greaterParis.geo.json";

// get greater Paris definition
fetch(url)
  .then(response => response.json())
  .then(fc => { 

    // feature ids to remove e.g. central Paris
    var removeIds = [868, 869, 870, 871, 872, 873, 874, 875, 876, 877, 878, 879, 880, 881, 882, 883, 884, 885, 886, 887];

    // filter features to remove central Paris
    var hole = fc.features.filter(f => !removeIds.includes(f.properties.ID_APUR))

    // do the union over each feature
    var union = hole[0];
    for (let i=1; i<hole.length; i++) {
      union = turf.union(union, hole[i]);
    }

    // new Feature collection with unioned features
    var fc2 = {
      "type": "FeatureCollection",
      "features": [union] // note features has to be an array
    }

    // add to map
    L.geoJson(fc2).addTo(map);
  
  });
Run Code Online (Sandbox Code Playgroud)