Estoy tratando de recibir los datos de mi API en los gráficos de mi sitio web. Estoy atascado tratando de llenar mis gráficos con los datos, tengo el código para completar los gráficos, pero cuando mapeo los datos JSON e intento dividir los datos en Fecha y temperatura para ponerlos en el gráfico, simplemente no funciona.

Este es el código:

 var xmlhttp = new XMLHttpRequest(); var url = "http://localhost:8090/api/grafico/datos/temperatura/medicionAire/2059"; xmlhttp.open("GET", url, true); xmlhttp.send(); xmlhttp.onreadystatechange = function () { if (this.readyState == 4 && this.status == 200) { var data = JSON.parse(this.responseText); //console.log(data); var dateG = data.map(function(elem) { return elem.fecha; }); var temperatureG = data.map(function(elem) { return elem.temperatura; }); } }

Intenté depurarlo y parece que no reconoce "fecha" o "temperatura" dentro de la matriz, aunque "elem" tiene la matriz: como puede ver en esta imagen, "elem" tiene la matriz, pero "elem.fecha" no está definido y no sé por qué. Debería devolverme una matriz con solo "fecha" de cada línea.

Registro de salida de datos:

 [Array(4)] 0: Array(4) 0: {fecha: '2021-09-03T13:15:41.943Z', temperatura: 22.33} 1: {fecha: '2021-09-03T13:15:41.230Z', temperatura: 22.33} 2: {fecha: '2021-09-03T13:15:04.243Z', temperatura: 22.33} 3: {fecha: '2021-09-03T13:14:06.923Z', temperatura: 16.56} length: 4 [[Prototype]]: Array(0) length: 1 [[Prototype]]: Array(0)