Данные, полученные из API, не отображаются на холсте. js сюжет - PullRequest
0 голосов
/ 09 февраля 2020

Данный серверный код извлекает данные, но я не знаю, почему они не присваиваются yVal и графику

snapshot of the output graph

Ниже приведен код сервера, который извлекает данные из API и отправляет их обратно клиенту

const fetch = require("node-fetch");
const static = require('node-static');
const fileServer = new static.Server('.');
var express = require('express');
var app = express();

let url = "https://io.adafruit.com/api/v2/Drake_Sully/feeds/local-area1";

 app.listen(8081);
 app.use(express.static('./'))


app.get('/status', async (req,res)=>{
let response = await fetch(url);   
let data = await response.json();
res.send(data);
})

Ниже приведен код клиента, где get () запрашивает сервер получить данные из API

class Uploader {

constructor() {}

async plotLastValue(){

var dps = []; // dataPoints
var chart = new CanvasJS.Chart("plotLastValue", {
  title :{
    text: "Load vs Time Graph"
  },
   axisX:{
    title: "time in hour",
    gridDashType: "dot",
    gridThickness: 2
   },
  axisY: {
    includeZero: false,
    title: "Load in kW",
    customBreaks: [{
      startValue: 1,
      endValue: 50,
      interval: 10,  
      maximum : 5
    }]
  },      
  data: [{
    type: "line",
    dataPoints: dps
  }]
});

var xVal = 0;
var yVal = 0; 
var updateInterval = 1000;
var dataLength = 20; // number of dataPoints visible at any point

async function get() {  // function to fetch data 
  let response = await fetch('status');
  let res = await response.json();
  return res["last_value"]; 
}


var updateChart = async function (count) {

  count = count || 1;

  for (var j = 0; j < count; j++) {
    let yVal = await get();
    dps.push({
      x: xVal,
      y: yVal
    });
    xVal++;
  }

  if (dps.length > dataLength) {
    dps.shift();
  }

  chart.render();
};

updateChart(dataLength);
setInterval(function(){updateChart()}, updateInterval);

 }
}

1 Ответ

0 голосов
/ 09 февраля 2020

Вероятно, данные, возвращаемые с await get(), - это не просто число. Это JSON представление возвращаемого значения. Чтобы увидеть формат, сделайте это:

  let yVal = await get();
  console.log(">>>yVal",yVal);

и посмотрите, что действительно возвращается. Если это объект типа { y: 7 }, то вы должны выдвигать данные следующим образом:

dps.push({
  x: xVal,
  y: yVal.y
});
...