0

我有一个如下的 JSON 数据

 [
  {
    "name": "car",
    "value": "",
    "children": [
      {
        "name": "v8_engine",
        "value": "",
        "children": [
          {
            "name": "cylinder-arrangement",
            "value": "",
            "children": [
              {
                "name": "type",
                "value": "string",
                "children": []
              },
              {
                "name": "max-elements",
                "value": "8",
                "children": []
              }
            ]
          }
        ]
      },
      {
        "name": "other-parts",
        "value": "",
        "children": [
          {
            "name": "per-cylinder-parts",
            "value": "",
            "children": [
              {
                "name": "piston-diameter",
                "value": "",
                "children": [
                  {
                    "name": "type",
                    "value": "uint32",
                    "children": []

                  },
                  {
                    "name": "range",
                    "value": "2000... 9000",
                    "children": []

                  }
                ]
              },
              {
                "name": "valves",
                "value": "",
                "children": [
                  {
                    "name": "number",
                    "value": "",
                    "children": []
                  },
                  {
                    "name": "position",
                    "value": "",
                    "children": []
                  }
                ]
              }
            ]
          }
        ]
      }
    ]
  }
] 

我想解析每个元素及其各自的子元素,并将它们列为父子元素和它们的孙子,就像 GOJS 中的一棵简单的树。

我正在使用以下逻辑,但这只是解析和推送 go-js 模型中的节点数据和链接数据数组元素。

变量 i=0;

            function loop(a) {
                if(a.yang_type!='' && a.name!=''){
                  nodeDataArray.push({ key:i,Data: a.yang_type + " " + a.name, group: -1 });
                    console.log("Data:",a.yang_type);
                    linkDataArray.push({ from: i, to: i+1 });
              }

                if(a.name!='' && a.value!=''){
                    nodeDataArray.push({ key:i,Data: a.name + " " + a.value, group: -1 });
                    linkDataArray.push({ from: 0, to: i+1 });

                }
                //console.log(a.name);
                i=i+1;
                // process you data
                Array.isArray(a.children) && a.children.forEach(loop); // check and iterate children
                myDiagram.model = go.GraphLinksModel(nodeDataArray, linkDataArray);

            }

附件是我得到的输出,但孩子们很混乱。我在推动时错过了一些逻辑吗?在此处输入图像描述

4

2 回答 2

0
var nodeDataArray = [
                                 {isGroup:true,key:-1,text:"Service Parameters",xy:"210 31.999999999999996"},
                                 { isGroup: true, key: -2, text: "Device Model", xy: "435 36.000000000000014"}
                               ];
                    var linkDataArray = [];


                    var i=0;
                    function loop(from) {           
                        return function (a) {
                            var f = i;

                            if(a.yang_type!='' && a.name!=''){
                                  nodeDataArray.push({ key:i,Data: a.yang_type + " " + a.name, group: -1 });
                                  //c=c+a.name;
                                  //console.log("c:",c);
                                //console.log("Data:",a.yang_type);
                                //linkDataArray.push({ from: i, to: i+1 });
                              }

                            if(a.name!='' && a.value!=''){
                                nodeDataArray.push({ key:i,Data: a.name + " " + a.value, group: -1 });
                                //c=c+a.name+a.value;
                                console.log("c:",c);
                                //linkDataArray.push({ from: 0, to: i+1 });

                            }
                            if (from !== undefined) {
                                linkDataArray.push({ from: from, to: i });
                            }
                            i++;
                            if (Array.isArray(a.children)) {
                                a.children.forEach(loop(f));
                            }
                            //console.log("c:",c);
                        };

                    }
于 2016-06-22T17:24:50.510 回答
0

我建议您使用 GoJS TreeModel而不是GraphLinksModelhttp://gojs.net/latest/intro/usingModels.html

查看 DOM 树示例,http ://gojs.net/latest/samples/DOMTree.html 。特别注意traverseDom功能。TreeModel 期望有从子数据到父数据的引用。HTML DOM 与从 JSON 解析的数据一样,在父数据的 Array 中具有对子项的引用。该示例的traverseDom函数确保每个数据对象都有一个数字或字符串键,然后将子对象的parent属性分配给该键值。

然后,您可以将这些对象的 Array 用作TreeModel.nodeDataArray

于 2016-06-21T20:55:13.553 回答