When sending 3 datasets from the database to the frontend Angular via Rest-API, everything functions correctly.
If you open the browser console, you will see all three datasets retrieved through node.js via Rest-API: View in Browser Console
The data displayed in the browser console is structured as follows:
0:
device_id: 2885679
list: Array(1)
0:
dt: 1596608643
main:
humidity: 10
pressure: 7.86
temp: 120.052
temp_max: 40.052
temp_min: 20.052
__proto__: Object
__proto__: Object
length: 1
__proto__: Array(0)
message: "1"
__v: 0
_id: "5f2a63857ce17d64d49465a4"
The TypeScript code within the xy.component.ts component is structured like this:
export class ContactsComponent {...}
The issue arises when trying to log deviceData
. It only shows the last value of the iteration instead of displaying all values needed to draw a graph based on 3 timestamps. The aim is to include all data points for plotting (refer to screenshots of the browser console).
Upon visualizing the graph in the browser, it only portrays one point, reflecting the single value logged by console.log(deviceData)
:
Graph Image
What could be causing this issue and how can it be rectified?
Thank you, Eden