D3.js verbinden Daten aus mehreren CSV-Dateien

Question

Ich bin neu in D3 und wurde beauftragt, ein Dashboard für die Anzeige von Ölbohrlochdaten zu erstellen. Die Daten befinden sich in 3 CSV-Dateien mit den folgenden Überschriften.

1. Firmendaten: Company, FacilityName, WellName, WellId, WellGasNRI, WellOilNRI, WellShrinkageFactor, WellYieldFactor

2. Well Budget Schätzungen: WellId, Monat, Jahr, DaysInMonth, GrossOil, GrossGas, GrossBOE, NetBOE

3. Actual gut Produktion: WellId, Datum, GrossOil, GrossGas, NetOil, NetGas, GasWithShrinkage, GasWithYield

Ich habe mit d3.nest gearbeitet, um Datensätze in jeder Datei zu gruppieren, möchte aber die gruppierten Arrays in einer einzigen Struktur zusammenführen.

Eine der Hauptanzeigen ist es, die Budgetschätzung für jeden Brunnen und dann für jeden Tag nach der tatsächlichen Produktion zu vergleichen.

Jede Hilfe würde sehr geschätzt werden.

Answer 1

Eine Möglichkeit ist es nisten mehrere d3.csv Anrufe zu tun, wie hier erklärt: Importing data from multiple csv files in D3:

d3.csv("file1.csv", function(data1) { 
    d3.csv("file2.csv", function(data2) { 
    d3.csv("file3.csv", function(data3) { 
     // do something with the data 
     console.log("CSV1", data1); 
     console.log("CSV2", data2); 
     console.log("CSV3", data3); 
    }); 
    }); 
}); 

Eine weitere Option (die ich bevorzugen) ist d3.queue zu verwenden (das ist ein Plug-in ist - Sie importieren müssen queue.js separat):

queue() 
    .defer(d3.csv, 'file1.csv') 
    .defer(d3.csv, 'file2.csv') 
    .defer(d3.csv, 'file3.csv') 
    .await(processData); 

function processData(data1, data2, data3) { 
    // do something with the data 
    console.log("CSV1", data1); 
    console.log("CSV2", data2); 
    console.log("CSV3", data3); 
} 

Von dort können Sie d3 und JavaScript-Array Manipulation Funktionen zu kombinieren, merge, Split und tun alles, was Sie mit den Datenobjekten wollen. Sie können beispielsweise verwenden, um Ihre CSVs so zu organisieren, dass sie mit dem Feld WellId ausgewählt und dann mit geschachtelten for-Schleifen oder einem anderen Mechanismus kombiniert werden können. Hier sind einige gute Tutorials und Referenzen in Bezug auf Datenmanipulation in D3:

• d3-array Documentation
• Manipulating data like a boss with d3