如何基于对象过滤GeoJson中的对象?

时间:2018-10-25 05:56:43

标签: javascript json d3.js filter geojson

我想基于基于多选下拉菜单中所做选择创建的对象过滤我的GeoJSON数据。

GeoJSON数据

    {
    "type": "Feature",
    "geometry": {
       "type": "Point",
       "coordinates":  [ -115.55783329999998,32.9646667 ]
    },
    "properties": {  "magType":"mb", "type":"earthquake","horizontalError":0.32,"depthError":0.58,    "city":"Brawley",    "state":"California",    "country":"US"}
  },
  {
    "type": "Feature",
    "geometry": {
       "type": "Point",
       "coordinates":  [ -115.54583329999998,32.98 ]
    },
    "properties": {   "magType":"mb", "type":"earthquake",    "horizontalError":0.24, "depthError":0.46,    "city":"Brawley",    "state":"California", "country":"US"
    }
  },
  {
    "type": "Feature",
    "geometry": {
       "type": "Point",
       "coordinates":  [ -118.13383329999999,33.777333299999995 ]
    },
    "properties": {"magType":"ml","type":"earthquake","horizontalError":0.77,"depthError":0.9, "city":"Brawley","state":"California","country":"US"
    }
  },
  {
    "type": "Feature",
    "geometry": {
       "type": "Point",
       "coordinates":  [ -115.555,32.967 ]
    },
    "properties": {"magType":"ml","type":"earthquake",    "horizontalError":0.43,    "depthError":0.67,    "city":"Isangel","state":"Tafea","country":"VU"
  },
  {
    "type": "Feature",
    "geometry": {
       "type": "Point",
       "coordinates":  [ -115.55216670000001,32.9658333 ]
    },
    "properties": {"magType":"mw","type":"tsunami", "horizontalError":0.79, "depthError":1.35, "city":"Zaybak", "state":"Badakhshan", "country":"AF"
    }
  },

所选值的对象:

sel_data_category = {country:['US','AF'], city: ['Brawley','Zaybak'], magType:['mw']}
sel_data_quant ={horizontalError:[0.68,0.90]}

我想根据这些选择的值过滤数据。因此,预期输出应为-

{
    "type": "Feature",
    "geometry": {
       "type": "Point",
       "coordinates":  [ -115.55216670000001,32.9658333 ]
    },
    "properties": {"magType":"mw","type":"tsunami", "horizontalError":0.79, "depthError":1.35, "city":"Zaybak", "state":"Badakhshan", "country":"AF"
    }
  }

有什么办法可以执行此操作?

编辑:错过了horizo​​ntalError值

1 个答案:

答案 0 :(得分:3)

您可以使用Array.filter

解决方案1:特定的过滤器参数

let arr = [{"type":"Feature","geometry":{"type":"Point","coordinates":[-115.55783329999998,32.9646667]},"properties":{"magType":"mb","type":"earthquake","horizontalError":0.32,"depthError":0.58,"city":"Brawley","state":"California","country":"US"}},{"type":"Feature","geometry":{"type":"Point","coordinates":[-115.54583329999998,32.98]},"properties":{"magType":"mb","type":"earthquake","horizontalError":0.24,"depthError":0.46,"city":"Brawley","state":"California","country":"US"}},{"type":"Feature","geometry":{"type":"Point","coordinates":[-118.13383329999999,33.777333299999995]},"properties":{"magType":"ml","type":"earthquake","horizontalError":0.77,"depthError":0.9,"city":"Brawley","state":"California","country":"US"}},{"type":"Feature","geometry":{"type":"Point","coordinates":[-115.555,32.967]},"properties":{"magType":"ml","type":"earthquake","horizontalError":0.43,"depthError":0.67,"city":"Isangel","state":"Tafea","country":"VU"}},{"type":"Feature","geometry":{"type":"Point","coordinates":[-115.55216670000001,32.9658333]},"properties":{"magType":"mw","type":"tsunami","horizontalError":0.79,"depthError":1.35,"city":"Zaybak","state":"Badakhshan","country":"AF"}}];

let filterObj = {country:['US','AF'], city: ['Brawley','Zaybak'], magType:['mw']};

let result = arr.filter(o => filterObj.country.includes(o.properties.country) 
                             && filterObj.city.includes(o.properties.city) 
                             && filterObj.magType.includes(o.properties.magType));

console.log(result);

解决方案2:通用过滤器参数(数组中的所有值)

let arr = [{"type":"Feature","geometry":{"type":"Point","coordinates":[-115.55783329999998,32.9646667]},"properties":{"magType":"mb","type":"earthquake","horizontalError":0.32,"depthError":0.58,"city":"Brawley","state":"California","country":"US"}},{"type":"Feature","geometry":{"type":"Point","coordinates":[-115.54583329999998,32.98]},"properties":{"magType":"mb","type":"earthquake","horizontalError":0.24,"depthError":0.46,"city":"Brawley","state":"California","country":"US"}},{"type":"Feature","geometry":{"type":"Point","coordinates":[-118.13383329999999,33.777333299999995]},"properties":{"magType":"ml","type":"earthquake","horizontalError":0.77,"depthError":0.9,"city":"Brawley","state":"California","country":"US"}},{"type":"Feature","geometry":{"type":"Point","coordinates":[-115.555,32.967]},"properties":{"magType":"ml","type":"earthquake","horizontalError":0.43,"depthError":0.67,"city":"Isangel","state":"Tafea","country":"VU"}},{"type":"Feature","geometry":{"type":"Point","coordinates":[-115.55216670000001,32.9658333]},"properties":{"magType":"mw","type":"tsunami","horizontalError":0.79,"depthError":1.35,"city":"Zaybak","state":"Badakhshan","country":"AF"}}];

let filterObj = {country:['US','AF'], city: ['Brawley','Zaybak'], magType:['mw']};
let filterObjArray = Object.entries(filterObj);

let result = arr.filter(o => filterObjArray.every(([k,v]) => v.includes(o.properties[k])));

console.log(result);

编辑

let arr = [{"type":"Feature","geometry":{"type":"Point","coordinates":[-115.55783329999998,32.9646667]},"properties":{"magType":"mb","type":"earthquake","horizontalError":0.32,"depthError":0.58,"city":"Brawley","state":"California","country":"US"}},{"type":"Feature","geometry":{"type":"Point","coordinates":[-115.54583329999998,32.98]},"properties":{"magType":"mb","type":"earthquake","horizontalError":0.24,"depthError":0.46,"city":"Brawley","state":"California","country":"US"}},{"type":"Feature","geometry":{"type":"Point","coordinates":[-118.13383329999999,33.777333299999995]},"properties":{"magType":"ml","type":"earthquake","horizontalError":0.77,"depthError":0.9,"city":"Brawley","state":"California","country":"US"}},{"type":"Feature","geometry":{"type":"Point","coordinates":[-115.555,32.967]},"properties":{"magType":"ml","type":"earthquake","horizontalError":0.43,"depthError":0.67,"city":"Isangel","state":"Tafea","country":"VU"}},{"type":"Feature","geometry":{"type":"Point","coordinates":[-115.55216670000001,32.9658333]},"properties":{"magType":"mw","type":"tsunami","horizontalError":0.79,"depthError":1.35,"city":"Zaybak","state":"Badakhshan","country":"AF"}}];

let sel_data_category = {country:['US','AF'], city: ['Brawley','Zaybak'], magType:['mw']}
let sel_data_quant ={horizontalError:[0.68,0.90]}
let filterObjArray = Object.entries(sel_data_category);
let filterQuantArray = Object.entries(sel_data_quant);

let result = arr.filter(o => filterObjArray.every(([k,v]) => v.includes(o.properties[k])) && filterQuantArray.every(([k,[l,h]]) => o.properties[k] >= l && o.properties[k] <= h));

console.log(result);