2

階層内に独自のノード配列を持つレイヤー/レベルとして作成された各ノードを使用して、階層を動的に構築したいと思います。これはツリー構造を形成する必要があります。ルートノードと、階層サイズを構成するための未定義の数のノードとレベルが必要です。ルートノード以外は修正しないでください。階層を読んだり検索したりする必要はありません。階層を構築する必要があります。配列は{"name": "A"、 "children":[]}で始まり、レベルとしてすべての新しいノードが作成されます{"name": "A"、 "children":[ここ-{"name": "A"、 "children":[]}]}。子配列では、どんどん深くなっていきます。基本的に、ルートノードを除いて、配列には呼び出し前の値がないはずです。関数呼び出しの後、配列は、データベースクエリの結果に応じて、呼び出しごとに異なる可能性のある番号の必要なノードで構成されている必要があります。すべての子配列には、1つ以上のノード値が含まれます。ルートを含めて、少なくとも2つのノードレベルが必要です。最初は空白のキャンバスである必要があります。つまり、事前定義された配列値はありません。

4

2 に答える 2

5
    function Tree(name,child){
        this.name = name;
        this.children = child || [];
        this.addNode = function (parent){
            this.children = parent;
        }
        this.addChild = function (parentName){
            this.children.push(new Tree(parentName));
        }
    }

    var tree = new Tree("A"); // create a tree (or a portion of a tree) with root "A" and empty children
    tree.addChild("B1");   // A -> B1
    tree.addChild("B2");   // A -> B2
    var subTree1 = new Tree("C1"); // create a sub tree
    subTree1.addChild("D1");   // C1 -> D1
    subTree1.addChild("D2");   // C1 -> D2
    tree.children[0].addNode(subTree1);   // add this sub tree under A->B1
    // Tree now is:  A--> B1
    //                      C1
    //                        D1
    //                        D2
    //                    B2
    tree.children[1].addChild("C2");
    // Tree now is:  A--> B1
    //                      C1
    //                        D1
    //                        D2
    //                    B2
    //                      C2
    //tree.children[0].addChild("C4");
    // Tree now is:  A--> B1
    //                      C1
    //                        D1
    //                        D2
    //                      C4
    //                    B2
    //                      C2    
    console.log(JSON.stringify(tree));

出力

{
  "name": "A",
  "children": [
    {
      "name": "B1",
      "children": {
        "name": "C1",
        "children": [
          {
            "name": "D1",
            "children": []
          },
          {
            "name": "D2",
            "children": []
          }
        ]
      }
    },
    {
      "name": "B2",
      "children": [
        {
          "name": "C2",
          "children": []
        }
      ]
    }
  ]
}
于 2012-09-21T00:04:56.387 に答える
3

したがって、ノードにはname:プロパティとchildren:配列プロパティがあります。

データベースは通常、ツリーをテーブルに格納します。

node-id, parent-id, value1, ..., valueN

(深さ優先の訪問順序と深さ優先の戻り順序を保存すると、特定の利点が得られます。詳細が必要な場合は、コメントで尋ねてください)。

単一のクエリを作成し、このデータを JSON に取得すると、(説明用に) 次のようになります。

[{id: "0", parent: "-1", name: "A2"}, {id: "1", parent: "0", name: "A3"}, 
 {id: "2", parent: "1", name: "A31"}, {id: "3", parent: "2", name: "A311"}, 
 {id: "4", parent: "2", name: "A312"}]

{name: children:}次のコードを使用して、これを形式に変換できます。

  // data is an array in the above format
function toTree(data) {
   var childrenById = {}; // of the form id: [child-ids]
   var nodes = {};        // of the form id: {name: children: }
   var i, row;
   // first pass: build child arrays and initial node array
   for (i=0; i<data.length; i++) {
       row = data[i];
       nodes[row.id] = {name: row.name, children: []};
       if (row.parent == -1) { // assume -1 is used to mark the root's "parent"
          root = row.id; 
       } else if (childrenById[row.parent] === undefined) {
          childrenById[row.parent] = [row.id];
       } else {
          childrenById[row.parent].push(row.id);
       }
   }
   // second pass: build tree, using the awesome power of recursion!
   function expand(id) {
       if (childrenById[id] !== undefined) {
           for (var i=0; i < childrenById[id].length; i ++) {
               var childId = childrenById[id][i];
               nodes[id].children.push(expand(childId));
           }
       }
       return nodes[id];
   }
   return expand(root);
}

実際の例については、 http://jsfiddle.net/z6GPB/を参照してください。

于 2012-09-20T23:14:09.773 に答える