从JSON文件JavaScript创建自定义树视图

时间:2015-08-24 15:47:17

标签: javascript json treeview

我有以下JSON。

 json_data = [
{  "ServiceRequests": [
{
  "Header": {
    "NewNetworkServiceProvider": "8051",
    "PurchaseOrderNumber": "1517400004BELLON",
    "Version": "01",
    "RecordType": "001",
    "ServiceRecordType": 0
},
  "Details": [
    {
      "NewNetworkServiceProvider": "8051",
      "PurchaseOrderNumber": "1517400004BELLON",
      "VersionString": "01",
      "RecordType": "005",
      "ServiceRecordType": 5
    }
  ]
},
{
  "Header": {
    "NewNetworkServiceProvider": "8051",
    "PurchaseOrderNumber": "1517400003BELLON",
    "Version": "01",
    "RecordType": "001",
    "ServiceRecordType": 0
  },
  "Details": [
    {
      "NewNetworkServiceProvider": "8051",
      "PurchaseOrderNumber": "1517400003BELLON",
      "VersionString": "01",
      "RecordType": "005",
      "ServiceRecordType": 5
    },
    {
      "NewNetworkServiceProvider": "8051",
      "PurchaseOrderNumber": "1517400003BELLON",
      "VersionString": "01",
      "RecordType": "005",
      "ServiceRecordType": 5
    },
    {
      "NewNetworkServiceProvider": "8051",
      "PurchaseOrderNumber": "1517400003BELLON",
      "VersionString": "01",
      "RecordType": "005",
      "ServiceRecordType": 5
    }
  ]
},
{
  "Header": {
    "NewNetworkServiceProvider": "8051",
    "PurchaseOrderNumber": "1517400002BELLON",
    "Version": "01",
    "RecordType": "001",
    "ServiceRecordType": 0
  },
  "Details": [
    {
      "NewNetworkServiceProvider": "8051",
      "PurchaseOrderNumber": "1517400002BELLON",
      "VersionString": "01",
      "RecordType": "005",
      "ServiceRecordType": 5
    },
    {
      "NewNetworkServiceProvider": "8051",
      "PurchaseOrderNumber": "1517400002BELLON",
      "VersionString": "01",
      "RecordType": "005",
      "ServiceRecordType": 5
    },
    {
      "NewNetworkServiceProvider": "8051",
      "PurchaseOrderNumber": "1517400002BELLON",
      "VersionString": "01",
      "RecordType": "005",
      "ServiceRecordType": 5
    }
  ]
}]}     ];

我想把它转换成这样的东西:

treedata_avm = [
  {
    label: 'Service Request',
    children: [
      {
        label: 'Record 1',
        children: [
          {
            label: 'Header',
            data: {
              definition: "This is header",
              data_can_contain_anything: true
            }
          }, {
            label: 'Details',
            data: {
              definition: "This is header",
              data_can_contain_anything: true
            }
          }
        ]
      }, {
        label: 'Record 2',
        children: [
          {
            label: 'Header',
            data: {
              definition: "This is header",
              data_can_contain_anything: true
            }
          }, {
            label: 'Details',
            data: {
              definition: "This is header",
              data_can_contain_anything: true
            }
          }
        ]
      },
      {
        label: 'Record 3',
        children: [
          {
            label: 'Header',
            data: {
              definition: "This is header",
              data_can_contain_anything: true
            }
          }, {
            label: 'Details',
            data: {
              definition: "This is header",
              data_can_contain_anything: true
            }
          }
        ]
      }
    ]
  }
];

我已经开始编写代码了,但是我正忙着为我的新输出创建正确的标签名称。我不关心细节,我想建立它的索引,就像在树视图中。

    var records = json_data;

for (var i =0; i < records.length; i++) {
    if (!newArrays[records[i].ServiceRequests]) {
      newArrays[records[i].ServiceRequests] = [];
      newArrays[records[i].ServiceRequests].push(records[i].ServiceRequests[i]);
      for (var j=0; j < newArrays[records[i].ServiceRequests].length; j++){

      }            
    }        
}

1 个答案:

答案 0 :(得分:1)

我总是发现最容易使用for循环来获取JSON对象的标签。因此,此代码应该可以获得您想要的格式:

Dim WS As Worksheet
Dim cht As Shape

Chart:

Set WS = ActiveSheet

On Error Resume Next
    Set cht = WS.Shapes("CHART1")

    ' I think the following line makes the need to re-create the chart from scratch redundant, as this refreshes the chart!
    cht.Chart.Refresh

    cht.Delete
On Error GoTo 0


Set cht = WS.Shapes.AddChart(xlLineMarkers)

With cht

    .Name = "CHART1"
    .Title = "Acuity Scores"

    .Top = 0
    .Left = 500
    .Height = 250
    .Width = 500

End With

With cht.Chart

    '.PlotArea.Select
    .SetSourceData Source:=WS.Range("B5:B" & WS.Range("A1000").End(xlUp).Row)

    .HasTitle = True
    .Axes(xlCategory, xlPrimary).HasTitle = True
    .Axes(xlCategory, xlPrimary).AxisTitle.Characters.Text = "Protocol ID"

    .Axes(xlValue, xlPrimary).HasTitle = True
    .Axes(xlValue, xlPrimary).AxisTitle.Characters.Text = "Acuity Score"

End With

With cht.Chart.SeriesCollection(1)

    .Name = "Acuity Score"
    .XValues = WS.Range("A5:A" & WS.Range("A1000").End(xlUp).Row)
    .Trendlines.Add Type:=xlLinear, Name:="Average Acuity"

End With

或查看此codepen