我正在 Node.JS 中工作并处理如下所示的大型 JSON 对象(请注意,格式化时)
{
"_id": "552ecae96054158575914f50",
"Wpt-1": {
"Lat": "34.843213",
"Lon": "-118.005453",
"Alt": 5000,
"Ty": 4,
"Scale-Lat": 6,
"Scale-Lon": 6,
"Scale-Alt": 4,
"Tu": 1,
"Vel": 132
},
"Wpt-2": {
"Lat": "34.852209",
"Lon": "-117.987876",
"Alt": 4500,
"Ty": 5,
"Scale-Lat": 6,
"Scale-Lon": 6,
"Scale-Alt": 4,
"Tu": 1,
"Vel": 132
},
"Pri-Wpt": {
"Lat": "34.89528",
"Lon": "-117.903598",
"Alt": 2100,
"Ty": 5,
"Scale-Lat": 6,
"Scale-Lon": 6,
"Scale-Alt": 4,
"Tu": 0,
"Vel": 127
},
"Wpt-4": {
"Lat": "34.904633",
"Lon": "-117.885272",
"Alt": 2100,
"Ty": 2,
"Scale-Lat": 6,
"Scale-Lon": 6,
"Scale-Alt": 4,
"Tu": 0,
"Vel": 6
},
"Details": {
"187674": {
"3344800": [
{
"Geo-Details": {
"Pri-Wpt": 242,
"Pri-Wpt-Indx": 21,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 187761,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 92,
"c4_wptNum": 584
},
"Hash": -1807266671
}
}
]
},
"188465": {
"3361007": [
{
"Geo-Details": {
"Pri-Wpt": 1966,
"Pri-Wpt-Indx": 31,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 187761,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 95,
"c4_wptNum": 942
},
"Hash": -1807266671
}
}
]
},
"202129": {
"3653337": [
{
"Geo-Details": {
"Pri-Wpt": 504,
"Pri-Wpt-Indx": 21,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 202212,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 88,
"c4_wptNum": 547
},
"Hash": -1807252220
}
}
]
},
"210935": {
"3843146": [
{
"Geo-Details": {
"Pri-Wpt": 439,
"Pri-Wpt-Indx": 21,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 211032,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 105,
"c4_wptNum": 969
},
"Hash": -1807243400
}
}
]
},
"216948": {
"3954104": [
{
"Geo-Details": {
"Pri-Wpt": 276,
"Pri-Wpt-Indx": 21,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 187761,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 104,
"c4_wptNum": 989
},
"Hash": -1807266671
}
}
]
},
"216980": {
"3955100": [
{
"Geo-Details": {
"Pri-Wpt": 2333,
"Pri-Wpt-Indx": 31,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 187761,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 104,
"c4_wptNum": 989
},
"Hash": -1807266671
}
}
]
},
"222550": {
"4080129": [
{
"Geo-Details": {
"Pri-Wpt": 463,
"Pri-Wpt-Indx": 21,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 187761,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 95,
"c4_wptNum": 942
},
"Hash": -1807266671
}
}
]
},
"223547": {
"4106665": [
{
"Geo-Details": {
"Pri-Wpt": 267,
"Pri-Wpt-Indx": 21,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 187761,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 110,
"c4_wptNum": 2173
},
"Hash": -1807266671
}
}
]
},
"224012": {
"4119553": [
{
"Geo-Details": {
"Pri-Wpt": 221,
"Pri-Wpt-Indx": 21,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 187761,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 107,
"c4_wptNum": 673
},
"Hash": -1807266671
}
}
]
},
"227030": {
"4173956": [
{
"Geo-Details": {
"Pri-Wpt": 567,
"Pri-Wpt-Indx": 21,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 211032,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 158,
"c4_wptNum": 998
},
"Hash": -1807243400
}
}
]
},
"261957": {
"4779815": [
{
"Geo-Details": {
"Pri-Wpt": 276,
"Pri-Wpt-Indx": 21,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 187761,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 108,
"c4_wptNum": 989
},
"Hash": -1807266671
}
}
]
},
"265659": {
"4857160": [
{
"Geo-Details": {
"Pri-Wpt": 463,
"Pri-Wpt-Indx": 21,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 187761,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 95,
"c4_wptNum": 942
},
"Hash": -1807266671
}
}
]
},
"265767": {
"4860626": [
{
"Geo-Details": {
"Pri-Wpt": 463,
"Pri-Wpt-Indx": 21,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 187761,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 95,
"c4_wptNum": 942
},
"Hash": -1807266671
}
}
]
},
"267100": {
"4897273": [
{
"Geo-Details": {
"Pri-Wpt": 242,
"Pri-Wpt-Indx": 21,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 187761,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 93,
"c4_wptNum": 584
},
"Hash": -1807266671
}
}
]
},
"272778": {
"5014510": [
{
"Geo-Details": {
"Pri-Wpt": 2333,
"Pri-Wpt-Indx": 31,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 272848,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 108,
"c4_wptNum": 989
},
"Hash": -1807181584
}
}
]
},
"274636": {
"5052398": [
{
"Geo-Details": {
"Pri-Wpt": 1966,
"Pri-Wpt-Indx": 31,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 272848,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 95,
"c4_wptNum": 942
},
"Hash": -1807181584
}
}
]
},
"281480": {
"5207980": [
{
"Geo-Details": {
"Pri-Wpt": 2902,
"Pri-Wpt-Indx": 31,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 187761,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 93,
"c4_wptNum": 584
},
"Hash": -1807266671
}
}
]
},
"293448": {
"5438565": [
{
"Geo-Details": {
"Pri-Wpt": 2902,
"Pri-Wpt-Indx": 31,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 187761,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 93,
"c4_wptNum": 584
},
"Hash": -1807266671
}
}
]
},
"307779": {
"5712719": [
{
"Geo-Details": {
"Pri-Wpt": 5299,
"Pri-Wpt-Indx": 31,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 187761,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 123,
"c4_wptNum": 584
},
"Hash": -1807266671
}
}
]
},
"308328": {
"5728003": [
{
"Geo-Details": {
"Pri-Wpt": 5299,
"Pri-Wpt-Indx": 31,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 187761,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 123,
"c4_wptNum": 584
},
"Hash": -1807266671
}
}
]
},
"311708": {
"5809765": [
{
"Geo-Details": {
"Pri-Wpt": 276,
"Pri-Wpt-Indx": 21,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 311810,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 108,
"c4_wptNum": 989
},
"Hash": -1807142622
}
}
]
},
"311740": {
"5810843": [
{
"Geo-Details": {
"Pri-Wpt": 2333,
"Pri-Wpt-Indx": 31,
"Validation-Status": "Validated",
"Geo-Res": 67,
"Taxi-Only-Route": false
}
},
{
"Ctg-Details": {
"Pri-Wpt": {
"c4_route": 311810,
"c4_indx": 1,
"c4_rwy": "Edw Rwy 04R (500ft)",
"c4_routeNum": 108,
"c4_wptNum": 989
},
"Hash": -1807142622
}
}
]
}
},
"Hashed-String": "Wpt[lat=34.843213,lon=-118.005453,alt=NoReq,vel=NoReq,tu=NoReq,ty=4],Wpt[lat=34.852209,lon=-117.987876,alt=4500,vel=NoReq,tu=NoReq,ty=5],Wpt[lat=34.89528,lon=-117.903598,alt=2100,vel=NoReq,tu=0,ty=5],Wpt[lat=34.904633,lon=-117.885272,alt=NoReq,vel=6,tu=NoReq,ty=2],",
"Hash": "0b464306360ee6b04199069824614b2f"
}
我想知道是否存在 Node.JS 模块或纯 Javascript 模块,它可以接受 JSON 对象并输出 HTML,这将允许 JSON 可点击(这样我就可以深入了解各个级别) ),也许允许我减少数据(注意详细级别哈希如何具有大量冗余。
至少,这将是一个我可以输入 JSON 对象(或字符串化 JSON)的函数,并且输出将是支持它的正确 HTML 和 CSS。如果我可以填写更多有助于减少数据的参数,那就更酷了。
我认为已经创建了这样的东西,但我的 Google 搜索还不够好,无法找到合适的!
最佳答案
确实有。它的名字叫Dynatable 。它是一个“HTML5+JSON交互表格插件”。我很抱歉只是发布了一个链接,但它是您所要求的第 3 方模块。
Once we have our JSON dataset, we can perform all our interactive and dynamic logic directly on the JSON using JavaScript. By default, dynatable comes with functions for sorting, filtering (aka searching), and paginating. ... The results of the Operate step are rendered back to the DOM in the body of the table.
关于javascript - JSON 对象转换器到交互式 html,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29662523/