2016-05-28 1 views
0

Level: Anfänger.In D3 Sankey, wie kann ich die von Objekten oder Arrays anstelle von JSON oder CSV-Dateien laden?

Ich bin auf Sankey in D3 implementiert und die gezeigten Beispiele scheinen alle Daten aus JSON oder CSV statt einfach mit Objekten oder Arrays zu verwenden. Die einen oder anderen, die es anders machen, scheinen einen langen Spaziergang zu machen, anstatt die Sache zu vereinfachen.

Gibt es eine Möglichkeit, die Daten nur im Code zu laden, anstatt Daten als externe Datei zu formatieren? Vielen Dank!

Ein Beispiel der verfügbaren Code: http://bl.ocks.org/d3noob/c2637e28b79fb3bfea13

Antwort

0

Wenn Sie, ohne dabei irgendwelche Asynchron-Operationen zur Verfügung Ihrer Daten haben, dann können Sie dies wie folgt erreichen, ersetzen Sie die d3.json Linie

d3.json("sankey-formatted.json", function(error, graph) { 
    // ... 
}) 

Mit Ihrer benutzerdefinierten Ladefunktion z.B

loadData(function (graph) { 
    // contents of the function passed to d3.json 
}) 

Die Funktion loadData nun eine Funktion als Parameter empfängt, die mit dem Datum Sie haben aufgerufen werden sollen, die ein einfaches JS-Objekt sein können

function loadData(cb) { 
    var data = { 
    "nodes":[ 
    {"node":0,"name":"node0"}, 
    {"node":1,"name":"node1"}, 
    {"node":2,"name":"node2"}, 
    {"node":3,"name":"node3"}, 
    {"node":4,"name":"node4"} 
    ], 
    "links":[ 
    {"source":0,"target":2,"value":2}, 
    {"source":1,"target":2,"value":2}, 
    {"source":1,"target":3,"value":2}, 
    {"source":0,"target":4,"value":2}, 
    {"source":2,"target":3,"value":2}, 
    {"source":2,"target":4,"value":2}, 
    {"source":3,"target":4,"value":4} 
    ]} 

    // invoke the function passed as an argument 
    cb(data) 
} 

dies auf die harte Art und Weise sein würde, die leicht Weg wäre, diese Funktion loszuwerden und eine Variable zu haben, die die Daten direkt hält

var graph = { /* the nodes and links are here */ } 
// contents of the function passed to d3.json 
var graph = { /* the nodes and links are here */ } 
// contents of the function passed to d3.json 
Verwandte Themen