Wie die Datenstruktur in d3.js Beispiele von Mike Bostock

Question

Wie kann man wissen, die Struktur der jsons in Mike Bostock Beispiele wie dies wissen (nach d3 manipuliert beeing):

http://bl.ocks.org/mbostock/3886208

Meine Ziel ist es, es mit meinem eigenen Dummy-Array von JSON-Objekten zu implementieren, ohne CSV-Daten zu laden. Aber ich kann nicht herausfinden, wie die Jons aussehen sollten.

Datenmanipulation von Mike Bostock:

d3.csv("data.csv", function(d, i, columns) { 
    for (i = 1, t = 0; i < columns.length; ++i) t += d[columns[i]] = +d[columns[i]]; 
    d.total = t; 
    return d; 
}, function(error, data) { 
    if (error) throw error; 

Ich habe bereits versucht, lokal die CSV zu speichern und den Code oben in node.js Befehl ausführen, aber es hat nicht funktioniert. Gibt es einen leichteren Weg?

Answer 1

In der Dokumentation für d3 wird ein Beispiel gezeigt, wie eine CSV in ein Array von Objekten geparst wird. Hier ist ein Beispiel CSV-Datei:

Year,Make,Model,Length 
1997,Ford,E350,2.34 
2000,Mercury,Cougar,2.38 

Der resultierende JavaScript-Array ist:

[ 
    {"Year": "1997", "Make": "Ford", "Model": "E350", "Length": "2.34"}, 
    {"Year": "2000", "Make": "Mercury", "Model": "Cougar", "Length": "2.38"} 
] 

(von https://github.com/d3/d3-dsv/blob/master/README.md#dsv_parse)

Das bedeutet, dass in Ihrem Beispiel das erste Datenelement würde wie folgt aussehen:

[ 
    {"State": "AL", "Under 5 Years": "310504","5 to 13 Years": "552339","14 to 17 Years": "259034","18 to 24 Years": "450818","25 to 44 Years": "1231572","45 to 64 Years": "1215966","65 Years and Over": "641667"} 
] 

Oder so in einem einfacher zu lesen Format:

[ 
    { 
    "State": "AL", 
    "Under 5 Years": "310504", 
    "5 to 13 Years": "552339", 
    "14 to 17 Years": "259034", 
    "18 to 24 Years": "450818", 
    "25 to 44 Years": "1231572", 
    "45 to 64 Years": "1215966", 
    "65 Years and Over": "641667" 
    } 
] 

Ihre beste Wette wäre Bostock die CSV in eine JSON in CSV-Konverter zu kopieren (this one has worked for me aber es gibt viele andere) und dann die JSON in Ihrem lokalen Code verwenden.

Wenn Sie die D3-CSV-Ladefunktionen verwenden, wird es Ihnen aufgrund von Kreuzherkunftsanforderungsfehlern schwerfallen, eine lokale Datei ohne einen einfachen Server zu erstellen.

Auch ich weiß nicht genau, was Sie meinen, wenn Sie sagen, dass Sie dies als node.js Befehl ausgeführt haben - ich denke, dass Sie wahrscheinlich Ihr Javascript und das Json-Objekt in eine '.js' Datei aufnehmen möchten Verknüpfen Sie das mit einer HTML-Datei, oder fügen Sie einfach Ihr Javascript in die HTML-Datei ein, wenn es ein einfaches Projekt ist (wie Bostock in der visuellen Verknüpfung)