Im trying to receive the data from my api into the charts at my website. Im stuck trying to fill my charts with the data, I have the code for filling the charts but when I map the JSON data and try to split the data into Date and temperature to put it in the chart it just does not work.
This is the code:
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;
});
}
}
I tried debuging it and it look like it does not recognize "fecha" or "temperatura" inside the array eventhough "elem" has the array in it: As you can see in this image, "elem" has the array in it, but "elem.fecha" is undefined and I dont know why. It should return me an array with only "fecha" of each line.
Log output of data:
[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)
I believe if you were to modify you code into something like so:
var dateG = data.map(function(elem) {
return elem.map(function(innerElem) {
return innerElem.fecha
});
});
You would end up with dateG as 2D array of fetcha values.