Konvertiere flache JSON-Datei in hierarchische JSON-Daten wie flare.json [d3-Beispieldatei]

Nach einem mühsamen Kampf habe ich fast herausgefunden, wie man eine flache JSON-Datei in eine hierarchische konvertieren kann. Ich habe die Funktion nicht selbst geschrieben. Ich habe es von unten nachgeschrieben.Konvertiere flache JSON-Datei in hierarchische JSON-Daten wie flare.json [d3-Beispieldatei]

D3 JSON DATA CONVERSION

Aber jetzt jetzt das Problem ist, die Funktion, die in der Post geschrieben hat nur zwei Hierarchieebene. Aber ich suche nach 4 Ebenen Hierarchie. Ich habe versucht, die Funktion außer Kraft zu setzen, bei der ich gescheitert bin.

Code mit dem, was ich versuche.

 

    
     var data = [ 
     { "dep": "First Top", "name": "First child", "model": "value1", "size": "320" }, 
     { "dep": "First Top", "name": "First child", "model": "value2", "size": "320" }, 
     { "dep": "First Top", "name": "First child", "model": "value3", "size": "320" }, 
     { "dep": "First Top", "name": "First child", "model": "value4", "size": "320" }, 
     { "dep": "First Top", "name": "SECOND CHILD", "model": "value1", "size": "320" }, 
     { "dep": "First Top", "name": "SECOND CHILD", "model": "value2", "size": "320" }, 
     { "dep": "First Top", "name": "SECOND CHILD", "model": "value3", "size": "320" }, 
     { "dep": "First Top", "name": "SECOND CHILD", "model": "value4", "size": "320" }, 
     { "dep": "Second Top", "name": "First Child", "model": "value1", "size": "320" }, 
     { "dep": "Second Top", "name": "First Child", "model": "value2", "size": "320" }, 
     { "dep": "Second Top", "name": "First Child", "model": "value3", "size": "320" }, 
     { "dep": "Second Top", "name": "First Child", "model": "value4", "size": "320" }, 
     { "dep": "Second Top", "name": "SECOND CHILD", "model": "value1", "size": "320" }, 
     { "dep": "Second Top", "name": "SECOND CHILD", "model": "value2", "size": "320" }, 
     { "dep": "Second Top", "name": "SECOND CHILD", "model": "value3", "size": "320" }, 
     { "dep": "Second Top", "name": "SECOND CHILD", "model": "value4", "size": "320" }, 
     { "dep": "Third Top", "name": "First Child", "model": "value2", "size": "320" }, 
     { "dep": "Third Top", "name": "First Child", "model": "value3", "size": "320" }, 
     { "dep": "Third Top", "name": "First Child", "model": "value4", "size": "320" }, 
     { "dep": "Third Top", "name": "First Child", "model": "value5", "size": "320" }, 
     { "dep": "Third Top", "name": "Second Child", "model": "value1", "size": "320" }, 
     { "dep": "Third Top", "name": "Second Child", "model": "value2", "size": "320" }, 
     { "dep": "Third Top", "name": "Second Child", "model": "value3", "size": "320" }, 
     { "dep": "Third Top", "name": "Second Child", "model": "value4", "size": "320" } 
     ] 

    var newData = {"name":"root", "children":{}} 

    data.forEach(function(d){ 
     if(typeof newData.children[d.dep] !== 'undefined') { 
      newData.children[d.dep].children.push(d) 
     } else { 
      newData.children[d.dep] = {"name": d.dep, "children": [{"name": d.name, "children": [{"name": d.model, "size": d.size}]}]} 
     } 
    }) 





    newData.children = Object.keys(newData.children).map(function (key) { return newData.children[key]; }); 

       // show what we've got 
       d3.select('body').append('pre') 
        .text(JSON.stringify(newData, null, ' '));

Ausgabe des aktuellen Code

 

    { 
     "name": "root", 
     "children": [ 
     { 
      "name": "First Top", 
      "children": [ 
      { 
       "name": "First child", 
       "children": [ 
       { 
        "name": "value1", 
        "size": "320" 
       } 
       ] 
      }, 
      { 
       "dep": "First Top", 
       "name": "First child", 
       "model": "value2", 
       "size": "320" 
      }, 
      { 
       "dep": "First Top", 
       "name": "First child", 
       "model": "value3", 
       "size": "320" 
      }, 
      { 
       "dep": "First Top", 
       "name": "First child", 
       "model": "value4", 
       "size": "320" 
      }, 
      { 
       "dep": "First Top", 
       "name": "SECOND CHILD", 
       "model": "value1", 
       "size": "320" 
      }, 
      { 
       "dep": "First Top", 
       "name": "SECOND CHILD", 
       "model": "value2", 
       "size": "320" 
      }, 
      { 
       "dep": "First Top", 
       "name": "SECOND CHILD", 
       "model": "value3", 
       "size": "320" 
      }, 
      { 
       "dep": "First Top", 
       "name": "SECOND CHILD", 
       "model": "value4", 
       "size": "320" 
      } 
      ] 
     }, 
     { 
      "name": "Second Top", 
      "children": [ 
      { 
       "name": "First Child", 
       "children": [ 
       { 
        "name": "value1", 
        "size": "320" 
       } 
       ] 
      }, 
      { 
       "dep": "Second Top", 
       "name": "First Child", 
       "model": "value2", 
       "size": "320" 
      }, 
      { 
       "dep": "Second Top", 
       "name": "First Child", 
       "model": "value3", 
       "size": "320" 
      }, 
      { 
       "dep": "Second Top", 
       "name": "First Child", 
       "model": "value4", 
       "size": "320" 
      }, 
      { 
       "dep": "Second Top", 
       "name": "SECOND CHILD", 
       "model": "value1", 
       "size": "320" 
      }, 
      { 
       "dep": "Second Top", 
       "name": "SECOND CHILD", 
       "model": "value2", 
       "size": "320" 
      }, 
      { 
       "dep": "Second Top", 
       "name": "SECOND CHILD", 
       "model": "value3", 
       "size": "320" 
      }, 
      { 
       "dep": "Second Top", 
       "name": "SECOND CHILD", 
       "model": "value4", 
       "size": "320" 
      } 
      ] 
     }, 
     { 
      "name": "Third Top", 
      "children": [ 
      { 
       "name": "First Child", 
       "children": [ 
       { 
        "name": "value2", 
        "size": "320" 
       } 
       ] 
      }, 
      { 
       "dep": "Third Top", 
       "name": "First Child", 
       "model": "value3", 
       "size": "320" 
      }, 
      { 
       "dep": "Third Top", 
       "name": "First Child", 
       "model": "value4", 
       "size": "320" 
      }, 
      { 
       "dep": "Third Top", 
       "name": "First Child", 
       "model": "value5", 
       "size": "320" 
      }, 
      { 
       "dep": "Third Top", 
       "name": "Second Child", 
       "model": "value1", 
       "size": "320" 
      }, 
      { 
       "dep": "Third Top", 
       "name": "Second Child", 
       "model": "value2", 
       "size": "320" 
      }, 
      { 
       "dep": "Third Top", 
       "name": "Second Child", 
       "model": "value3", 
       "size": "320" 
      }, 
      { 
       "dep": "Third Top", 
       "name": "Second Child", 
       "model": "value4", 
       "size": "320" 
      } 
      ] 
     } 
     ] 
    }

gewünschten Ausgabeformates:

 

    { 
     "name": "root", 
     "children": [ 
     { 
      "name": "First Top", 
      "children": [ 
      { 
       "name": "First child", 
       "children": [ 
       { 
        "name": "value1", 
        "size": "320" 
       }, 
       { 
        "name": "value2", 
        "size": "320" 
       }, 
       { 
        "name": "value3", 
        "size": "320" 
       }, 
       { 
        "name": "value4", 
        "size": "320" 
       } 
       ] 
      }, 
      { 
       "name": "Second child", 
       "children": [ 
       { 
        "name": "value1", 
        "size": "320" 
       }, 
       { 
        "name": "value2", 
        "size": "320" 
       }, 
       { 
        "name": "value3", 
        "size": "320" 
       }, 
       { 
        "name": "value4", 
        "size": "320" 
       } 
       ] 
      }, 

      ] 
     }, 
     { 
      "name": "Second Top", 
      "children": [ 
      { 
       "name": "First child", 
       "children": [ 
       { 
        "name": "value1", 
        "size": "320" 
       }, 
       { 
        "name": "value2", 
        "size": "320" 
       }, 
       { 
        "name": "value3", 
        "size": "320" 
       }, 
       { 
        "name": "value4", 
        "size": "320" 
       } 
       ] 
      }, 
      { 
       "name": "Second child", 
       "children": [ 
       { 
        "name": "value1", 
        "size": "320" 
       }, 
       { 
        "name": "value2", 
        "size": "320" 
       }, 
       { 
        "name": "value3", 
        "size": "320" 
       }, 
       { 
        "name": "value4", 
        "size": "320" 
       } 
       ] 
      }, 
      ] 
     }, 
     { 
      "name": "Third Top", 
      "children": [ 
      { 
       "name": "First child", 
       "children": [ 
       { 
        "name": "value1", 
        "size": "320" 
       }, 
       { 
        "name": "value2", 
        "size": "320" 
       }, 
       { 
        "name": "value3", 
        "size": "320" 
       }, 
       { 
        "name": "value4", 
        "size": "320" 
       } 
       ] 
      }, 
      { 
       "name": "Second child", 
       "children": [ 
       { 
        "name": "value1", 
        "size": "320" 
       }, 
       { 
        "name": "value2", 
        "size": "320" 
       }, 
       { 
        "name": "value3", 
        "size": "320" 
       }, 
       { 
        "name": "value4", 
        "size": "320" 
       } 
       ] 
      }, 
      ] 
     } 
     ] 
    }

ich breche mein Kopf von einer Woche, aber ich konnte nicht allein finde es heraus. Jemand ändert bitte die Funktion, um die Daten im hierarchischen Format zu erhalten, wie ich aktualisiert habe.

Vielen Dank im Voraus!

Quelle

2013-10-11 Unknown User

eine rekursive Methode

Dies sollte funktionieren für n Ebenen statt nur 2 oder 3. Sie müssen die Eigenschaften, die Ebenen definieren, geben Sie einfach zu verwenden aktualisiert.

var data = [ 
    { "dep": "First Top", "name": "First child", "model": "value1", "size": "320" }, 
    { "dep": "First Top", "name": "First child", "model": "value2", "size": "320" }, 
    { "dep": "First Top", "name": "SECOND CHILD", "model": "value1", "size": "320" }, 
    { "dep": "Second Top", "name": "First Child", "model": "value1", "size": "320" } 
]; 

var newData = { name :"root", children : [] }, 
    levels = ["dep","name"]; 

// For each data row, loop through the expected levels traversing the output tree 
data.forEach(function(d){ 
    // Keep this as a reference to the current level 
    var depthCursor = newData.children; 
    // Go down one level at a time 
    levels.forEach(function(property, depth){ 

     // Look to see if a branch has already been created 
     var index; 
     depthCursor.forEach(function(child,i){ 
      if (d[property] == child.name) index = i; 
     }); 
     // Add a branch if it isn't there 
     if (isNaN(index)) { 
      depthCursor.push({ name : d[property], children : []}); 
      index = depthCursor.length - 1; 
     } 
     // Now reference the new child array as we go deeper into the tree 
     depthCursor = depthCursor[index].children; 
     // This is a leaf, so add the last element to the specified branch 
     if (depth === levels.length - 1) depthCursor.push({ name : d.model, size : d.size }); 
    }); 
});

Quelle

2013-10-11 12:10:17

Hallo - Richard. Danke für die Antwort. Aber ich konnte die Namensspalte im JSON-Format nicht finden. Ich erhalte die Werte der dep-Spalte gefolgt vom Modellwert. Zwischen diesen beiden muss ich einen Namen hinzufügen, d. H. Dep> name> value. Wie mache ich es. Ich bin nicht so gut in der Bearbeitung der Funktion. Ich habe versucht, diese Zeile zu ändern - newData.children [d.dep] .children [childIndex] = {name: d.name, children [{name: d.model, size: d.size}]}; aber ich konnte es nicht verstehen. Danke nochmal im Voraus. –

Vielen Dank Richard. Nach vielen Tagen des Kampfes konnte ich es mit deiner Hilfe tun. Nochmals vielen Dank!! –

Hallo Richard - Bitte helfen Sie mir mit dieser [** Post **] (http://stackoverflow.com/questions/23737829/d3-help-required-in-editing-function). –

var data = [ 
    { "state": "UP", "district": "Agra", "block": "IradatNagar","school":"APS","name":"A" }, 
    { "state": "UP", "district": "Agra", "block": "IradatNagar","school":"IPS","name":"B" }, 
    { "state": "UP", "district": "Agra", "block": "IradatNagar","school":"APS","name":"C" }, 
    { "state": "MP", "district": "Bhopal", "block": "chota_Bhopal","school":"DPS","name":"D" }, 
    { "state": "UP", "district": "Mathura", "block": "Farah","school":"HPS","name":"E" }, 
    { "state": "UP", "district": "Kanpur", "block": "Mania","school":"BPs","name":"F" }, 
    { "state": "UP", "district": "Agra", "block": "Arjun Nagar","school":"GPS","name":"G" }, 
    { "state": "MP", "district": "Gwalior", "block": "Surya Nagar","school":"DPS","name":"H" } 
]; 

var newData = { name :"State", children : [] }, 
    levels = ["state","district","block","school"]; 

data.forEach(function(d){ 
    var depthCursor = newData.children; 
    levels.forEach(function(property, depth) 
    { 
     var index; 
     depthCursor.forEach(function(child,i) 
     { 
      if (d[property] == child.name) 
       index = i; 
     }); 

     if (isNaN(index)) 
     { 
      depthCursor.push({name : d[property], children : []}); 
      index = depthCursor.length - 1; 
     } 

     depthCursor = depthCursor[index].children; 

     if (depth === levels.length - 1) 
     { 
      depthCursor.push({ name : d.name}); 
     } 
    }); 
}); 

console.log(newData);

Quelle

2017-11-09 09:23:13

Konvertiere flache JSON-Datei in hierarchische JSON-Daten wie flare.json [d3-Beispieldatei]

Antwort

Verwandte Themen