Reactjs从（geo）json获取坐标

我是react JS的初学者，我使用react传单进行地图绘制， 在这张地图上我放了一些带有坐标点的标记

简而言之，我尝试从JSON文件中获取一些对象，其中包含按面积计算的值，以及地图上多边形渲染的坐标点，如下所示：

{
  "type": "FeatureCollection",
  "crs": {
    "type": "name",
    "properties": {
      "name": "urn:ogc:def:crs:OGC:1.3:CRS84"
    }
  },
  "features": [
    {
      "type": "Feature",
      "id": 656,
      "properties": {
        "DCOMIRIS": "940180101",
        "DEPCOM": "94018",
        "NOM_COM": "Charenton-le-Pont",
        "IRIS": "0101",
        "TYP_IRIS": "H",
        "DEP": "94",
        "aire": 0.2069,
        "population": 3974 
      },
      "geometry": {
        "type": "MultiPolygon",
        "coordinates": [
          [
            [
              [2.4197, 48.8214],
              [2.4196, 48.8205],
              [2.4196, 48.8199],
              [2.4196, 48.819],
              [2.4196, 48.8181],
              [2.4196, 48.8172],
              [2.4196, 48.8169],
              [2.4183, 48.8167],
              [2.418, 48.8166],
              [2.4166, 48.8164],
              [2.4159, 48.8163],
              [2.4159, 48.8163],
              [2.4159, 48.8163],
              [2.4155, 48.817],
              [2.4152, 48.8175],
              [2.4149, 48.8178],
              [2.4148, 48.8181]
            ]
          ]
        ]
      }
    },
    {
      "type": "Feature",
      "id": 657,
      "properties": {
        "DCOMIRIS": "940180109",
        "DEPCOM": "94018",
        "NOM_COM": "Charenton-le-Pont",
        "IRIS": "0109",
        "TYP_IRIS": "H",
        "DEP": "94",
        "aire": 0.4146,
        "population": 3906
      },
      "geometry": {
        "type": "MultiPolygon",
        "coordinates": [
          [
            [
              [2.4055, 48.8245],
              [2.4053, 48.8244],
              [2.4042, 48.8235],
              [2.4032, 48.8226],
              [2.4024, 48.8219],
              [2.4014, 48.8211],
              [2.4013, 48.821],
              [2.4011, 48.8209],
              [2.401, 48.8207],
              [2.4009, 48.8207],
              [2.4009, 48.8206],
              [2.4007, 48.8207],
              [2.3996, 48.8212]
            ]
          ]
        ]
      }
    }

var find = _.findWhere(this.state.data, {coordinates: [2.4055,         48.8245]});

使用下划线，我尝试获取具有坐标值的对象，如下所示：

{
  "type": "FeatureCollection",
  "crs": {
    "type": "name",
    "properties": {
      "name": "urn:ogc:def:crs:OGC:1.3:CRS84"
    }
  },
  "features": [
    {
      "type": "Feature",
      "id": 656,
      "properties": {
        "DCOMIRIS": "940180101",
        "DEPCOM": "94018",
        "NOM_COM": "Charenton-le-Pont",
        "IRIS": "0101",
        "TYP_IRIS": "H",
        "DEP": "94",
        "aire": 0.2069,
        "population": 3974 
      },
      "geometry": {
        "type": "MultiPolygon",
        "coordinates": [
          [
            [
              [2.4197, 48.8214],
              [2.4196, 48.8205],
              [2.4196, 48.8199],
              [2.4196, 48.819],
              [2.4196, 48.8181],
              [2.4196, 48.8172],
              [2.4196, 48.8169],
              [2.4183, 48.8167],
              [2.418, 48.8166],
              [2.4166, 48.8164],
              [2.4159, 48.8163],
              [2.4159, 48.8163],
              [2.4159, 48.8163],
              [2.4155, 48.817],
              [2.4152, 48.8175],
              [2.4149, 48.8178],
              [2.4148, 48.8181]
            ]
          ]
        ]
      }
    },
    {
      "type": "Feature",
      "id": 657,
      "properties": {
        "DCOMIRIS": "940180109",
        "DEPCOM": "94018",
        "NOM_COM": "Charenton-le-Pont",
        "IRIS": "0109",
        "TYP_IRIS": "H",
        "DEP": "94",
        "aire": 0.4146,
        "population": 3906
      },
      "geometry": {
        "type": "MultiPolygon",
        "coordinates": [
          [
            [
              [2.4055, 48.8245],
              [2.4053, 48.8244],
              [2.4042, 48.8235],
              [2.4032, 48.8226],
              [2.4024, 48.8219],
              [2.4014, 48.8211],
              [2.4013, 48.821],
              [2.4011, 48.8209],
              [2.401, 48.8207],
              [2.4009, 48.8207],
              [2.4009, 48.8206],
              [2.4007, 48.8207],
              [2.3996, 48.8212]
            ]
          ]
        ]
      }
    }

var find = _.findWhere(this.state.data, {coordinates: [2.4055,         48.8245]});

但我什么都没有，我不知道如何在json中搜索“更深”。 如果我尝试：

var find = _.findWhere(this.state.data, {id: 656});

给我拿对象

---

有什么建议吗？

您面临的问题是

find

方法可能正在比较每个

json

坐标对象，如：

"coordinates": [
      [
        [
          [2.4055, 48.8245],
          [2.4053, 48.8244],
          [2.4042, 48.8235],
          [2.4032, 48.8226],
          [2.4024, 48.8219],
          [2.4014, 48.8211],
          [2.4013, 48.821],
         ]
      ]
]

对于您提供的对象：

"coordinates": 
    [2.4055, 48.8245]

---

这个比较返回false。

您面临的问题是

find

方法可能正在比较每个

json

坐标对象，如：

"coordinates": [
      [
        [
          [2.4055, 48.8245],
          [2.4053, 48.8244],
          [2.4042, 48.8235],
          [2.4032, 48.8226],
          [2.4024, 48.8219],
          [2.4014, 48.8211],
          [2.4013, 48.821],
         ]
      ]
]

对于您提供的对象：

"coordinates": 
    [2.4055, 48.8245]

---

这个比较返回false。

据我所知，您正在JSON中搜索一个“feature”对象，它包含坐标

[2.4055，48.8245]

。 您需要执行几个步骤来搜索元素：

循环浏览

功能

属性

在

几何体中查找坐标。坐标
数组

这里的问题可能是坐标数组可能是嵌套的，因为它是一个对象。它可能是一层深：

[ [ 1.1, 2.2 ], [ 3.3, 4.4 ] ]

。。。或者像您的示例中那样，有两个或两个以上的深度：

[ [ [ 5.1, 6.2 ], [ 7.3, 8.4 ] ] ]

在这种情况下，您需要使用递归进行搜索。 下面是如何使用

lodash

或

下划线

（我使用

lodash

进行了测试）

//递归搜索函数。
函数查找（坐标、项目）{
变量i=0，发现；
对于（；i

---

结果是一个“feature”对象，其中包含您正在查找的坐标。
据我所知，您正在搜索包含坐标的JSON中的“feature”对象
[2.4055，48.8245]
。
您需要执行几个步骤来搜索元素：

循环浏览
功能
属性
在
几何体中查找坐标。坐标
数组

这里的问题可能是坐标数组可能是嵌套的，因为它是一个对象。它可能是一层深：

[ [ 1.1, 2.2 ], [ 3.3, 4.4 ] ]

。。。或者像您的示例中那样，有两个或两个以上的深度：

[ [ [ 5.1, 6.2 ], [ 7.3, 8.4 ] ] ]

在这种情况下，您需要使用递归进行搜索。
下面是如何使用
lodash
或
下划线
（我使用
lodash
进行了测试）

//递归搜索函数。
函数查找（坐标、项目）{
变量i=0，发现；
对于（；i

result
是一个“feature”对象，其中包含您正在查找的坐标。
是的，我想知道这是否是问题所在，但我无法更改庞大的de-json，因此，逐个检查项的循环是解决方案？不。请看这个：TL；DR loop遍历所有
坐标
元素，并检查您试图查找的对象的
索引。啊，我想知道这是否可能是问题所在，但我无法更改庞大的de json，因此，逐个检查项的循环是解决方案？不。看看这个：TL；DR循环遍历所有
坐标
元素，并检查要查找的对象的
索引