У меня проблема со вставкой в диаграмму. js только двух значений (временная метка и телеметрия процессора) из внешнего JSON (который удаленно расположен на VPS). В консоли все данные загружены правильно, мой код:
var theCpuUrl = "http://" + address + "/api/metric/cpu";
var xmlhttp = new XMLHttpRequest();
var ctx = document.getElementById('cpuchart').getContext('2d');
var cpuchart = new Chart(ctx, {
type: 'bar',
data: {
labels: '......',
datasets: [{
label: 'cpu',
data: [80, 70, 80, 20, 10, 50],
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(255, 206, 86, 0.2)',
'rgba(75, 192, 192, 0.2)',
'rgba(153, 102, 255, 0.2)',
'rgba(255, 159, 64, 0.2)'
],
borderColor: [
'rgba(255, 99, 132, 1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)',
'rgba(75, 192, 192, 1)',
'rgba(153, 102, 255, 1)',
'rgba(255, 159, 64, 1)'
],
borderWidth: 1
}],
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero: false
}
}]
}
}
}
});
httpGetAsync(theCpuUrl, function(data, status) {
var myData = JSON.parse(data);
for (var i = 0; i < myData[0].length; i++) {
let time = myData[0][i].timestamp;
let value = myData[0][i].cpu;
}
});
xmlhttp.open("GET", theCpuUrl, true);
console.log(xmlhttp.readyState);
Этот код также связан с global.js
с помощью следующего кода:
var address = "192.168.13.60:12345"
function httpGetAsync(theUrl, callback) {
var xmlHttp = new XMLHttpRequest();
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4 && xmlHttp.status == 200)
callback(xmlHttp.responseText);
}
xmlHttp.open("GET", theUrl, true);
xmlHttp.setRequestHeader("Access-Control-Allow-Origin", "*");
xmlHttp.send(null);
}
Пожалуйста, кто-нибудь может объяснить, как мне Я рисую данные по оси Y и X. Большое спасибо.