如何在 Leaflet 的 FeatureCollection 属性中设置带有参数的多边形样式？

Question

我有一个 GeoJSON 文件，其中包含 FeatureCollection 和 Feature 类型。基本上我的代码如下 (working sample here):

L.geoJSON(myJSON, { style: style }).addTo(mymap);

function style(featureObject) {
    return {
        fillColor: getColor(featureObject.properties.name),
        weight: 2,
        opacity: 1,
        color: 'white',
        dashArray: '3',
        fillOpacity: 0.7
    };
}

function getColor(name) {
    return name === "name1" ? "#CF8562" :
            name === "name2" ? "#FFEDA0" :
                                "#000000";
}

我的 GeoJSON 结构的一个小样本如下：

[
  {
    "type": "FeatureCollection",
    "properties": {
        "name" : "name1"
    },
    "features": [
      {
        "type": "Feature",
        "properties": {
            "randomParameter" : "text"
        },
        "geometry": {
          "type": "Polygon",
          "coordinates": [
            [
            [
            -46.6479847244904,
            -23.553060554172923
            ],
            [
            -46.6479847244904,
            -23.553060554172923
            ],
            [
            -46.64805562776844,
            -23.55318890961171
            ],
            [
            -46.64826795788915,
            -23.552928264599316
            ],
            [
            -46.6479847244904,
            -23.553060554172923
            ]
            ]
          ]
        }
      }]
  },
  {
    "type": "FeatureCollection",
    "properties": {
        "name" : "name2"
    },
    "features": [
      {
        "type": "Feature",
        "properties": {
            "randomParameter" : "text2"
        },
        "geometry": {
          "type": "Polygon",
          "coordinates": [
            [
            [
            -46.648050596629034,
            -23.55393832474017
            ],
            [
            -46.64758222900779,
            -23.554141824100373
            ],
            [
            -46.64767437978837,
            -23.554322319586415
            ],
            [
            -46.64814729501603,
            -23.55411425749883
            ],
            [
            -46.648050596629034,
            -23.55393832474017
            ]
            ]
          ]
        }
      }]
  }
]

此代码无法正常运行，因为它无法识别 featureObject.properties.name 值。此值仅存在于 FeatureCollection 中，而不存在于我的 GeoJSON 中的 Feature 类型中。因此，我无法根据 GeoJSON 中的数据为多边形着色。

我想编辑 FeatureCollection 类型下所有元素的样式。但是，当我打印到达 style 函数的对象时，我发现它只看到 Feature 类型的元素。我读过像这样的答案，告诉我们可以编辑 FeatureCollection 类型的样式，但我没能成功。

我想解决这个问题，而不必更改我的 GeoJSON 结构或将 FeatureCollection 中的属性更改为 Feature。可能吗？我可以让样式函数更改 FeatureCollection 类型下所有内容的样式，而不是我的 GeoJSON 中的 Feature 类型吗？

Answer 1

您可以先遍历所有 FeatureCollection 并将属性复制到子项：

https://jsfiddle.net/falkedesign/9yvb46o5/

function copyProps(geojson, props){
    var features = L.Util.isArray(geojson) ? geojson : geojson.features,
      i, len, feature;

    if(props && geojson.properties){
      geojson.properties = Object.assign({},props,geojson.properties); // merge properties, if the feature has the same property as the parent, it will not overwritten
    }

    if (features) {
      for (i = 0, len = features.length; i < len; i++) {
        feature = features[i];
        if (feature.geometries || feature.geometry || feature.features || feature.coordinates) {
          copyProps(feature, geojson.properties);
        }
      }
    }
  }

copyProps(myJSON);
var layersObj = L.geoJSON(myJSON, { style: style }).addTo(mymap);

如何在 Leaflet 的 FeatureCollection 属性中设置带有参数的多边形样式？

How can I style polygons with parameters inside the FeatureCollection properties on Leaflet?

javascript

leaflet