Tengo un archivo csv llamado text.csv que contiene lo siguiente:
shape,color,distance
circle,blue,4
square,red,2
circle,blue,7
circle,green,9
triangle,blue,1
square,green,3
octagon,blue,4
Quiero hacer lo siguiente:
distanceAquí está mi código:
<script src="https://d3js.org/d3.v7.min.js"></script>
d3.csv('test.csv', d3.autoType).then(function(data) {
// INSPECTS THE RAW DATA
console.log(data);
// SORTS BY DISTANCE
let sortedData = data.sort(function (a, b) {
return d3.descending(a.distance, b.distance);
})
// LOGS SORTED DATA
console.log(sortedData);
})
En la consola, veo que sortedData se registra dos veces .
La variable data (es decir, los datos sin clasificar sin procesar) no se está registrando.
¿Por qué está pasando esto?
¡Gracias!
Array.prototype.sort ordena la matriz en su lugar . Además, su sortedData simplemente apunta a data .
Por lo tanto, si desea conservar dos matrices (la original y la ordenada), debe duplicarlas, por ejemplo structuredClone utilizandostructuredClone:
const csv = `shape,color,distance
circle,blue,4
square,red,2
circle,blue,7
circle,green,9
triangle,blue,1
square,green,3
octagon,blue,4`;
const data = d3.csvParse(csv, d3.autoType);
console.log(data);
// SORTS BY DISTANCE
let sortedData = structuredClone(data).sort(function(a, b) {
return d3.descending(a.distance, b.distance);
})
// LOGS SORTED DATA
console.log(sortedData);
<script src="https://d3js.org/d3.v7.min.js"></script>