2017-05-25 1 views
2

Je reçois une structure json donnée ci-dessous à partir d'une API contenant des chemins d'enfants apparentés sous forme de tableau. par exemple ici est ma structure JSONStructure arborescente à partir de chemins de tableau utilisant javascript

[ 
    { 
    "name": "Children C1", 
    "path": [ 
     "A", 
     "B", 
     "C" 
    ] 
    }, 
    { 
    "name": "Children C2", 
    "path": [ 
     "A", 
     "B", 
     "C" 
    ] 
    }, 
    { 
    "name": "Children C3", 
    "path": [ 
     "A", 
     "B", 
     "C" 
    ] 
    }, 
    { 
    "name": "Children B1", 
    "path": [ 
     "A", 
     "B" 
    ] 
    }, 
    { 
    "name": "Children B2", 
    "path": [ 
     "A", 
     "B" 
    ] 
    }, 
    { 
    "name": "Children A1", 
    "path": [ 
     "A" 
    ] 
    }, 
    { 
    "name": "Children E1", 
    "path": [ 
     "D", 
     "E" 
    ] 
    } 
] 

chemin Voici l'itinéraire pour un childeren. Par exemple un premier moyen objet -A -B -C - Childeren C1

et ainsi de suite. J'utilise la bibliothèque de vue arborescente qui nécessite seulement cette structure

var tree=[ 
    { 
    'Name': 'A', 
    'children': [ 
     { 
     Name: '', 
     children: [ 

     ] 
     } 
    ] 
    } 
] 

et ainsi de suite. Je veux convertir ma structure de chemin en arbre. Besoin d'aide Je peux réaliser ceci avec du javasript simple.

Merci

Répondre

1
var result=input.reduce((obj,el)=>{ 
var orig=obj; 
    for(key of el.path){ 
    var found=obj.find(e=>e.name===key); 
    if(found){ 
     obj=found.children; 
    }else{ 
     var temp={name:key, children:[]}; 
     obj.push(temp); 
     obj=temp.children; 
    } 
} 
obj.push(el.name); 
return orig; 
},[]); 

http://jsbin.com/cowowisaji/edit?console

Il crée la structure suivante:

[{ 
    name:"A", 
    children:[ 
    "Children A1", 
    {name:B", children:[...]} 
    ] 
}] 

Il parcourt simplement sur tous les éléments et résout le creux de chemin recherche l'objet droit chemin dans un tableau, Si un élément de chemin n'existe pas, il le crée.

Le code peut être supérieur à shortified:

var result=input.reduce((obj,el)=>(el.path.reduce((path,name)=>(path.find(e=>e.name==name)||(path[path.length]={name:name,children:[]})).children,obj).push(el.name),obj),[]); 
1

Juste une autre approche avec un objet d'aide pour garder la référence aux objets nommés.

var data = [{ name: "Children C1", path: ["A", "B", "C"] }, { name: "Children C2", path: ["A", "B", "C"] }, { name: "Children C3", path: ["A", "B", "C"] }, { name: "Children B1", path: ["A", "B"] }, { name: "Children B2", path: ["A", "B"] }, { name: "Children A1", path: ["A"] }, { name: "Children E1", path: ["D", "E"] }], 
 
    tree = function (array) { 
 
     var result = [], 
 
      o = { _: result }; 
 

 
     array.forEach(function (a) { 
 
      a.path.concat(a.name).reduce(function (r, b) { 
 
       if (!r[b]) { 
 
        r[b] = { _: [] }; 
 
        r._.push({ name: b, children: r[b]._ }); 
 
       } 
 
       return r[b]; 
 
      }, o); 
 
     }); 
 
     return result; 
 
    }(data); 
 

 
console.log(tree);
.as-console-wrapper { max-height: 100% !important; top: 0; }