访问JSON中的变量?

时间:2018-08-17 15:06:29

标签: javascript angular

我目前正在使用Bing Isochrone Api。我使用HTTPClient在Angular中设置了http请求。这是我返回的数据集的示例:

{
"authenticationResultCode": "ValidCredentials",
"brandLogoUri": "http:\/\/dev.virtualearth.net\/Branding\/logo_powered_by.png",
"copyright": "Copyright © 2018 Microsoft and its suppliers. All rights reserved. This API cannot be accessed and the content and any results may not be used, reproduced or transmitted in any manner without express written permission from Microsoft Corporation.",
"resourceSets": [{
    "estimatedTotal": 1,
    "resources": [{
        "__type": "IsochroneResponse:http:\/\/schemas.microsoft.com\/search\/local\/ws\/rest\/v1",
        "origin": {
            "latitude": 47.640068,
            "longitude": -122.129858
        },
        "polygons": [{
            "coordinates": [
                [
                    [48.22848, -122.12867],
                    [48.22613, -122.10625],
                    [48.229309, -122.08228],
                    [48.23733, -122.07666],
                    [48.24474, -122.05325],
                    [48.24469, -122.0532],
                    [48.24424, -122.05386],
                    [48.23119, -122.06654],         
                    [48.22848, -122.12867]
                ]
            ]
        }]
    }]
}],
"statusCode": 200,
"statusDescription": "OK",
"traceId": "4ed97517798141a1b5bb9df40509f190|CO30305304|7.7.0.0|"

}

我可以用这个来获取资源集

 this
        .http
        .get(`http://dev.virtualearth.net/REST/v1/Routes/Isochrones?waypoint=\
        ${this.testPointlat},${this.testPointlong}&maxTime=15&timeUnit=Minutes\
        &dateTime=2017-11-27T18:00:00-08:00&travelMode=Driving\
        &key=$$$$$$$$$$$$$
        `).subscribe(
          (response) => {
            this.driveTimeCoords = response.resourceSets;
            console.log(this.driveTimeCoords);
            const polygons = this.driveTimeCoords.resources.polygons;
            console.log(polygons);
          }
        );
      })

所以this.driveTimeCoords给了我一个数组...我在尝试它之后的尝试显然没有用,因为它说未定义。我是否可以使用if或某物进行.foreach?我可能想得太多了。我想要的只是坐标,因此我可以将它们.map()放入传单的geojson特征组中。

谢谢!

编辑: 在console.log this.driveTimeCoords上,我得到

[{…}]0: estimatedTotal: 1resources: [{…}]

4 个答案:

答案 0 :(得分:1)

您的JSON格式已关闭:请注意resourceSetsresourcespolygons是对象数组,这意味着您需要调用数组的索引来访问数据,如下所示:

this.driveTimeCoords = response.resourceSets[0];
console.log(this.driveTimeCoords);
const polygons = this.driveTimeCoords.resources[0].polygons[0];
console.log(polygons);

要解决此问题,您的JSON格式应如下:

{
"authenticationResultCode": "ValidCredentials",
"brandLogoUri": "http:\/\/dev.virtualearth.net\/Branding\/logo_powered_by.png",
"copyright": "Copyright © 2018 Microsoft and its suppliers. All rights reserved. This API cannot be accessed and the content and any results may not be used, reproduced or transmitted in any manner without express written permission from Microsoft Corporation.",
"resourceSets": {
    "estimatedTotal": 1,
    "resources": {
        "__type": "IsochroneResponse:http:\/\/schemas.microsoft.com\/search\/local\/ws\/rest\/v1",
        "origin": {
            "latitude": 47.640068,
            "longitude": -122.129858
        },
        "polygons": {
            "coordinates": [
                {"latitude": 48.22848, "longitude": -122.12867},
                {"latitude": 48.22613, "longitude": -122.10625},
                {"latitude": 48.229309, "longitude": -122.08228},
                {"latitude": 48.23733, "longitude": -122.07666},
                {"latitude": 48.24474, "longitude": -122.05325},
                {"latitude": 48.24469, "longitude": -122.0532},
                {"latitude": 48.24424, "longitude": -122.05386},
                {"latitude": 48.23119, "longitude": -122.06654},         
                {"latitude": 48.22848, "longitude": -122.12867}
            ]
         }
    }
},
"statusCode": 200,
"statusDescription": "OK",
"traceId": "4ed97517798141a1b5bb9df40509f190|CO30305304|7.7.0.0|"
}

我在坐标中添加了变量名,以便于理解所读取的数据。

答案 1 :(得分:0)

根据您的JSON对象判断,它看起来像this.driveTimeCoords,它是对JSON中resourceSets的引用,是一个数组,对于您似乎想要的每个属性(资源,多边形,坐标)也都是数组。因此,您必须执行一系列嵌套的.map()操作。

请尝试以下操作:

var result = this.driveTimeCoords.map((obj)=>{
    return obj.resources.map((resource)=>{
       return resource.polygon.map((poly)=> poly.coordinates )
    })
})

执行此操作,以便在其中任何一个数组包含多个引用的情况下,将它们全部获取。然后,您可以展平数组,或者简单地引用另一个人建议的result[0][0][0]

中的第一个

答案 2 :(得分:0)

看到它们是数组,您需要通过其索引进行访问:

let json = {
"authenticationResultCode": "ValidCredentials",
"brandLogoUri": "http:\/\/dev.virtualearth.net\/Branding\/logo_powered_by.png",
"copyright": "Copyright © 2018 Microsoft and its suppliers. All rights reserved. This API cannot be accessed and the content and any results may not be used, reproduced or transmitted in any manner without express written permission from Microsoft Corporation.",
"resourceSets": [{
    "estimatedTotal": 1,
    "resources": [{
        "__type": "IsochroneResponse:http:\/\/schemas.microsoft.com\/search\/local\/ws\/rest\/v1",
        "origin": {
            "latitude": 47.640068,
            "longitude": -122.129858
        },
        "polygons": [{
            "coordinates": [
                [
                    [48.22848, -122.12867],
                    [48.22613, -122.10625],
                    [48.229309, -122.08228],
                    [48.23733, -122.07666],
                    [48.24474, -122.05325],
                    [48.24469, -122.0532],
                    [48.24424, -122.05386],
                    [48.23119, -122.06654],         
                    [48.22848, -122.12867]
                ]
            ]
        }]
    }]
}],
"statusCode": 200,
"statusDescription": "OK",
"traceId": "4ed97517798141a1b5bb9df40509f190|CO30305304|7.7.0.0|"
}

let polys = json['resourceSets'][0].resources[0].polygons;

let o = document.getElementById('output');
o.innerHTML = JSON.stringify(polys);
<div id="output"></div>

答案 3 :(得分:0)

使用这种格式,您可以访问以下路径:

.resourceSets[0].resources[0].polygons[0].coordinates[0][0][0] = 48.22848
.resourceSets[0].resources[0].polygons[0].coordinates[0][0][1] = -122.12867
.resourceSets[0].resources[0].polygons[0].coordinates[0][1][0] = 48.22613
.resourceSets[0].resources[0].polygons[0].coordinates[0][1][1] = -122.10625
.resourceSets[0].resources[0].polygons[0].coordinates[0][2][0] = 48.229309
.resourceSets[0].resources[0].polygons[0].coordinates[0][2][1] = -122.08228
.resourceSets[0].resources[0].polygons[0].coordinates[0][3][0] = 48.23733
.resourceSets[0].resources[0].polygons[0].coordinates[0][3][1] = -122.07666
.resourceSets[0].resources[0].polygons[0].coordinates[0][4][0] = 48.24474
.resourceSets[0].resources[0].polygons[0].coordinates[0][4][1] = -122.05325
.resourceSets[0].resources[0].polygons[0].coordinates[0][5][0] = 48.24469
.resourceSets[0].resources[0].polygons[0].coordinates[0][5][1] = -122.0532
.resourceSets[0].resources[0].polygons[0].coordinates[0][6][0] = 48.24424
.resourceSets[0].resources[0].polygons[0].coordinates[0][6][1] = -122.05386
.resourceSets[0].resources[0].polygons[0].coordinates[0][7][0] = 48.23119
.resourceSets[0].resources[0].polygons[0].coordinates[0][7][1] = -122.06654
.resourceSets[0].resources[0].polygons[0].coordinates[0][8][0] = 48.22848
.resourceSets[0].resources[0].polygons[0].coordinates[0][8][1] = -122.12867