javascript - OpenLayers 通过属性从 GeoJSON 创建图层

标签 javascript openlayers geojson

我想使用 OpenLayers v5.3.0 创建一个 Web 应用程序。

我能够将外部 GeoJSON 文件中的所有功能显示为 OSM 层上方的向量层,但我的 GeoJSON 文件包含数千个功能,每个功能都包含许多属性。

我正在寻找一种能够解析 GeoJSON 文件、按属性过滤它的方法(例如,具有属性 "gender": "f", 的所有功能>"ethnic_gro": "Latvian",) 并仅将其显示为 OSM 基础层上方的附加矢量图层。

这是我的 GeoJSON 文件的示例(缩写,只有一个功能):

{
  "type": "FeatureCollection",
  "features": [
    {
      "type": "Feature",
      "geometry": {
        "type": "LineString",
        "coordinates": [
          [23.114870000000053, 56.845980000000134],
          [19.131050000000164, 50.65641000000013]
        ]
      },
      "properties": {
        "OID_": "0",
        "ethnic_gro": "Latvian",
        "religion": "protestant",
        "marital_st": "widow",
        "status_in_": "NULL",
        "gender": "f",
      }
    }
  ]
}

感谢您的帮助!

最佳答案

您可以在原始特征数组上使用 JavaScript 数组过滤器来构建新的 GeoJSON 对象:

var filteredGeoJSON = {
  "type": "FeatureCollection",
  "features": fullGeoJSON.features.filter(function(feature){
     return (feature.properties.ethnic_gro == "Latvian" && feature.properties.gender == "f");
  })
};

或使用 forEach 循环构建过滤数组:

var filteredGeoJSON = { 
  "type": "FeatureCollection",
  "features": []
};
fullGeoJSON.features.forEach(function(feature){
  if (feature.properties.ethnic_gro == "Latvian" && feature.properties.gender == "f") {
    filteredGeoJSON.features.push(feature);
  }
});

关于javascript - OpenLayers 通过属性从 GeoJSON 创建图层,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53250709/

相关文章:

javascript - 如何访问 iframe 中 URL 的参数?

matplotlib 等高线图 geojson 输出?

javascript - 当我更改 AngularJS 中另一个选择选项的值时,如何更改选择选项的值?

javascript - 为什么设置 scrollTop 无法设置正确的位置?

javascript - 我想在提交后加载 php 一条消息以隐藏表单,但 event.preventDefault();破坏了对我的 .php 文件的 "already exists"检查

javascript - 如何使用 Openlayers 显示此代码中的纬度和经度?

php - 开放层 : remove multiple popups

javascript - Promise 返回 {} 而不是 ImageData (TypeScript)

d3.js - D3js 从 GeoJSON 生成路径

javascript - 根据 map 的缩放级别和点击显示多边形图层