Доброго времени суток, господа!
Я являюсь программистом АСУ-ТП: ПЛК, панели, пускатели и тд.
Нелегкая приказала изучать JS....
Клич о помощи! И снимаю шляпу, помогите разобраться с задачей.
Задача: Отображать на панели оператора чарт "Радар" по нескольким регистрам. Динамически изменяющаяся диаграмма каждую секунду. Все это бесовство происходит на панели оператора Wintek.
Уперся в то, что "Радар" отрисовывается, но при изменении значений ничего не происходит.
____
Прикрепляю исходный код, ссылку на архив проекта, дистрибутив (для любознательных) и ссылку с источником документации.
const chart = require('./chart.js');
const demoUtils = require('./utils.js');
// CanvasForChartJs is a polyfilled Canvas for chart.js
var CanvasForChartJs = function () {
var that = new Canvas();
that.canvas = {
get height() {
return that.height;
},
set height(val) {
that.height = val;
},
get width() {
return that.width;
},
set width(val) {
that.width = val;
},
getContext(contextType) {
return that;
}
}
that.toDataURL = function () {
return "";
}
that.resetTransform = function (){
console.error("Canvas.resetTransform() is not supported yet")
}
return that
}
window.Intl = {
NumberFormat: function (locale, options) {
return {
format: function (number) {
return "" + number
}
}
}
}
var ctx = new CanvasForChartJs();
ctx.height = 500;
ctx.width = 50
this.widget.add(ctx);
var datalog
var ch1,ch2,ch3,ch4,ch5,ch6;
datalog = driver.getData(this.config.datalog[0], 5, (err, data) => {
if (err) {
console.log('Error:', err.message);
} else {
ch1 = data.values[0];
ch2 = data.values[1];
ch3 = data.values[2];
ch4 = data.values[3];
ch5 = data.values[4];
ch6 = data.values[5];
}
});
new Chart(ctx, {
type: 'radar',
data: {
labels: [
'Eating',
'Drinking',
'Sleeping',
'Designing',
'Coding',
'Cycling',
'Running'
],
datasets: [{
label: 'My First Dataset',
data: [ch1,ch2,ch3,ch4,ch5,ch6],
fill: true,
backgroundColor: 'rgba(255, 99, 132, 0.2)',
borderColor: 'rgb(255, 99, 132)',
pointBackgroundColor: 'rgb(255, 99, 132)',
pointBorderColor: '#fff',
pointHoverBackgroundColor: '#fff',
pointHoverBorderColor: 'rgb(255, 99, 132)'
},]
},
options: {
elements: {
line: {
borderWidth: 3
}
}
},
});
Ссылка на ПО и проект --->>>
https://disk.yandex.ru/d/27qQq3afskv0Ig
Ссылка на документацию --->>>
https://dl.weintek.com/public/Docume...ent/index.html
Ссылка на документацию --->>>
https://www.chartjs.org/