0
238
VisualizaçõesMapeo a través de matriz en React con objetos anidados
Para un proyecto escolar, estoy haciendo un tablero donde quiero visualizar algunos datos. Ya lo tengo tan lejos que puedo cargar los datos en el front-end, que es reaccionar.
Ahora quiero obtener ciertos valores de la matriz. Pero dado que es una matriz bastante grande, no estoy exactamente seguro de cómo recorrer esto.
Los datos se ven así: 
Quiero tener el _value para cada objeto para que eventualmente pueda cargarlo en un gráfico de área desde el nuevo gráfico.
El código para el gráfico de área:
<AreaChart width={1550} height={400} data={this.getMachineData()} margin={{ top: 10, right: 30, left: 0, bottom: 0, }} > <CartesianGrid strokeDasharray="3 3" /> <XAxis dataKey="name" /> <YAxis dataKey="_table" /> <Tooltip /> <Area type="monotone" dataKey="uv" stackId="1" stroke="#8884d8" fill="#8884d8" /> <Area type="monotone" dataKey="pv" stackId="1" stroke="#82ca9d" fill="#82ca9d" /> <Area type="monotone" dataKey="amt" stackId="1" stroke="#ffc658" fill="#ffc658" /> <Legend /> <Bar dataKey="_value" fill="#8884d8" /> <Bar dataKey="uv" fill="#82ca9d" /> </AreaChart>Ya hice un método pero aún no está implementado:
getMachineData(data) { console.log(data) const result = data.map((innerArray) => { console.log(innerArray) // Map over the inner array return innerArray.map((item) => { // Return an object with only the properties you need return ({ time: item._time, value: item._value }); }); }) console.log(result) return result; };Estaba pensando en recorrer el objeto yo mismo con la función .map, pero dado que son objetos dentro de objetos, no estoy seguro de cómo hacerlo.
1 Respostas
Responde à pergunta0
No estoy seguro de lo que quiere decir con objetos dentro de objetos. Lo que veo en la imagen de arriba es una matriz (con 816 objetos) dentro de una matriz. Entonces, una forma más simple de usar la función de mapa sería:
const data = [ [ { _time: 1, _value: 2 }, { _time: 3, _value: 4 }, { _time: 5, _value: 6 }, { _time: 7, _value: 8 }, ] ] const results = [] // Map over the outer array data.map((innerArray) => { // Map over the inner array return innerArray.map((item) => { // Return an object with only the properties you need results.push({ time: item._time, value: item._value }); }); }) console.log(results);