Как мне создать диаграмму из этой JSON?

Question

Я новичок в javascript и пытаюсь создать диаграмму из этого JSON:

{
  "sid":10381,
  "dataunit":"kW",
  "data":[
    {
      "time":"00:00",
      "no":"0",
      "value":"0.00"
    },
    {
      "time":"00:20",
      "no":"2",
      "value":"0.00"
    },
    {
      "time":"00:40",
      "no":"4",
      "value":"0.00"
    },
    // ...
  ]
}

Теперь я хотел бы отобразить «время» как мой x и «значение» как мой y. («значение» отличается от нуля позже в JSON). Я пробовал следовать этому руководству:

https://canvasjs.com/docs/charts/how-to/javascript-charts-from-json-data-api-and-ajax/

.. но мне не удалось заставить его работать, меня смущает часть после $ .get JSON.

Любая помощь приветствуется!

Answer 1

Чтобы использовать JSON для диаграммы, я использую этот код:

let dataRequest = new Request("./datas/my_jsonf_file.json");

    await fetch(dataRequest)
        .then(function(resp) {
            return resp.json();
        })
        .then(
            async function(data) {
                this.dadosJSON = await Object.keys(data).map(function(key) {
                    return [key, data[key]];
                });
            });

    let data = new google.visualization.arrayToDataTable(this.dadosJSON);

, чтобы поймать это JSON:

{
    "Month": "Value",
    "Out": 50,
    "Nov": 23,
    "Dez": 45
}

Введите мой код javascript mounth и data [ключ] значение.

Answer 2

Вот код для получения точки данных:

var sample_json = {
  "sid":10381,
  "dataunit":"kW",
  "data":[
    {
      "time":"00:00",
      "no":"0",
      "value":"0.00"
    },
    {
      "time":"00:20",
      "no":"2",
      "value":"0.00"
    },
    {
      "time":"00:40",
      "no":"4",
      "value":"0.00"
    },
    // ...
  ]
};
var data = sample_json['data'];
var i;
var data_point = [];
var point = [];
for(i =0;i< data.length; i++){
  point = [];
  point.push(data[i]['time']);
  point.push(data[i]['value']);
  data_point.push(point);

  console.log(data_point);

}