在數據庫中,我有 3 個數據,我通過 Rest-API 將它們發送到前端 Angular。這很好用。在瀏覽器控制臺中,您可以看到我通過 Rest-API 通過 node.js 獲得的所有三個數據集: 它在瀏覽器控制臺中的外觀瀏覽器控制臺中的結果如下所示:0:device_id: 2885679list: Array(1)0:dt: 1596608643main:humidity: 10pressure: 7.86temp: 120.052temp_max: 40.052temp_min: 20.052__proto__: Object__proto__: Objectlength: 1__proto__: Array(0)message: "1"__v: 0_id: "5f2a63857ce17d64d49465a4"在 typescript 組件 xy.component.ts 中,我的代碼如下所示:export class ContactsComponent { chart: any = []; constructor(private contactService: ContactService) { } ngOnInit() { this.contactService.getContacts() .subscribe((res: any[]) => { console.log(res); for (let i = 0; i < res.length; i++) { let temp_max = res[i]['list'].map(res => res.main.temp_max); let temp_min = res[i]['list'].map(res => res.main.temp_min); let alldates = res[i]['list'].map(res => res.dt) console.log(alldates) let deviceData = [] alldates.forEach((res) => { let jsdate = new Date(res * 1000) deviceData.push(jsdate.toLocaleTimeString('en', { year: 'numeric', month: 'short', day: 'numeric' })) }) console.log(deviceData) this.chart = new Chart('canvas', { type: 'line', data: { labels: deviceData, datasets: [{ data: temp_max, borderColor: '#3cba9f', fill: false }, { data: temp_min, borderColor: '#ffcc00', fill: false }, ] },為什么console.log(deviceData)只返回迭代的最后一個值?我想返回所有值console.log(devicedata)以繪制基于 3 個時間戳的圖形。在這里,當我只返回 1 個時間戳時。它以某種方式覆蓋了 deviceData.push - Methode 的值。我的目標是繪制我擁有的所有數據點(請參閱瀏覽器控制臺的屏幕截圖)。
Chart.js,返回一個“日期”數組來繪制折線圖
嗶嗶one
2022-12-22 11:39:11