10
Qualcuno sa come ottenere un file csv url e convertirlo in un oggetto json in modo che possa utilizzare gli strumenti di google charting in js?convertire il file csv in json object datatable
A
risposta
3
Per quanto ne so, per la maggior parte degli scenari, è possibile trasformare csv in un array js di matrici, una matrice o qualsiasi oggetto javascript che segue la convenzione del proprio strumento di creazione di grafici.
Potrebbe essere necessario:
- Prendi il contenuto del file CSV
- Parse it
- Avvolgere i risultati da 2 nel vostro JSON strumento di creazione di grafici
- Chiama tua libreria grafici
Per 1, se il file CSV è ospitato nel dominio, è possibile eseguire una semplice XMLHttpRequest, altrimenti provare a cercare qui "s politica di origine ".
La parte difficile è il punto 2. Ho visto diversi tentativi falliti per analizzare i file CSV a mano (il punto e virgola può essere contenuto come parte del valore, ecc.) ... Controlla il link.
1
CSV e JSON sono formati diversi. JSON è gerarchico mentre CSV rappresenta un elenco di valori. Quindi immagino che sarà necessario prima analizzare il CSV (using a parser ovviamente e not implementing yourself). Questo parser ti darà un oggetto che potresti serializzare in JSON o probabilmente convertirlo in un altro oggetto prima di serializing (ancora usando un parser) per ottenere il formato desiderato.
18
Mi rendo conto che questa è una domanda vecchia, ma oggi mi sono imbattuto in tutto ciò che ha bisogno di fare la stessa cosa e ho scritto una sceneggiatura per farlo. Puoi verificarlo sul mio github repo.
Il seguente codice dovrebbe compiere ciò che stai dopo (usando jQuery):
$.ajax("http://my.domain.com/mycsvfile.csv", {
success: function(data) {
var jsonobject = csvjson.csv2json(data);
// Now use jsonobject to do some charting...
},
error: function() {
// Show some error message, couldn't get the CSV file
}
});
Felice di codifica :)
+1
Ho appena usato il file per ottenere un rapido prototipo di qualcosa. Sembrava buono fino a quando ho scoperto che i personaggi stavano trovando la loro strada in un Mongo (non avevo notato prima di allora). Alcuni punti nel codice richiedevano myString.replace (/ \ r/gm, "") per ripulirlo. – joevallender
+0
@joevallender Grazie per averlo indicato. Qualche possibilità di ricordare ancora cosa hai dovuto fare e creare un problema per questo?https://github.com/aaronsnoswell/csvjson.js/issues/new. – aaronsnoswell
+0
Avrei inviato una richiesta di pull se non lo stavo facendo al volo, lascerò cadere alcune note nella coda dei problemi ora – joevallender
1
utilizzare questo codice per guida analizzare il file csv a JSON ...
function processFiles(files) {
var file = files[0];
var reader = new FileReader();
reader.onload = function (e) {
var output = document.getElementById("fileOutput");
var texto = e.target.result;
csvJSON(texto);
};
reader.readAsText(file);
}
function csvJSON(csv) {
var lines = csv.split("\n");
var result = [];
var headers;
for (var i = 0; i < lines.length; i++) {
headers = lines[i].split("\n");
}
var cont = 0;
for (var i = 0; i < lines.length; i++) {
var obj = {};
var currentline = lines[i].split("\n");
for (var j = 0; j < headers.length; j++) {
obj[cont] = currentline[j];
}
cont++;
result.push(obj);
}
return JSON.stringify(result); //JSON
}
3
Papa Parse è bello per quello.
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="libraries/PapaParse-4.1.2/papaparse.min.js"></script>
<script>
$(document).ready(function(){
$("#submitbutton").click(function(){
var myfile = $("#csvfile")[0].files[0];
var json = Papa.parse(myfile,
{
header: true,
skipEmptyLines: true,
complete: function(results) {
console.log("Dataframe:", JSON.stringify(results.data));
console.log("Column names:", results.meta.fields);
console.log("Errors:", results.errors);
}
});
})
})
</script>
</head>
<body>
<form name="foo" method="post" enctype="multipart/form-data">
<input id="csvfile" type="file" value="i">
</form>
<button id="submitbutton" type="button">Upload CSV file!</button>
</body>
</html>
caricamento di questo CSV:
+------+----------------+---------------+------------+
| Id | Petal.Length | Petal.Width | Species |
+======+================+===============+============+
| 1 | 1.4 | 0.2 | setosa |
+------+----------------+---------------+------------+
| 2 | 1.4 | 0.2 | setosa |
+------+----------------+---------------+------------+
| 3 | 1.3 | 0.2 | setosa |
+------+----------------+---------------+------------+
| 4 | 3.9 | 1.4 | versicolor |
+------+----------------+---------------+------------+
| 5 | 3.5 | 1 | versicolor |
+------+----------------+---------------+------------+
| 6 | 4.2 | 1.5 | versicolor |
+------+----------------+---------------+------------+
| 7 | 5.4 | 2.3 | virginica |
+------+----------------+---------------+------------+
| 8 | 5.1 | 1.8 | virginica |
+------+----------------+---------------+------------+
Otterrete questo output nella console:
Dataframe: [{"Id":"1","Petal.Length":"1.4","Petal.Width":"0.2","Species":"setosa"},{"Id":"2","Petal.Length":"1.4","Petal.Width":"0.2","Species":"setosa"},{"Id":"3","Petal.Length":"1.3","Petal.Width":"0.2","Species":"setosa"},{"Id":"4","Petal.Length":"3.9","Petal.Width":"1.4","Species":"versicolor"},{"Id":"5","Petal.Length":"3.5","Petal.Width":"1","Species":"versicolor"},{"Id":"6","Petal.Length":"4.2","Petal.Width":"1.5","Species":"versicolor"},{"Id":"7","Petal.Length":"5.4","Petal.Width":"2.3","Species":"virginica"},{"Id":"8","Petal.Length":"5.1","Petal.Width":"1.8","Species":"virginica"}]
Column names: ["Id", "Petal.Length", "Petal.Width", "Species"]
Errors: []
Stai cercando di analizzare il CSV in JS o in un'altra lingua e solo che uscita JSON per JS? –
Sono stato in grado di analizzare i file CSV in due array in C# sul back-end. Ora vorrei creare un oggetto JSON (che posso usare sul front-end usando i dati di questi due array) per associarmi a un grafico di google js api. – locoboy