adds graph class
This commit is contained in:
45
web/classes.js
Normal file
45
web/classes.js
Normal file
@@ -0,0 +1,45 @@
|
|||||||
|
let intervalDelay = 5000;
|
||||||
|
|
||||||
|
class liveGraph {
|
||||||
|
// Constructor to initialize the graph
|
||||||
|
constructor(id) {
|
||||||
|
this.timeArray = [4, 5, 6, 7, 9];
|
||||||
|
this.valueArray = [1, 3, 4, 8, 10];
|
||||||
|
this.cnt = 0;
|
||||||
|
this.nodeId = id;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Fuction to create a graph
|
||||||
|
makeGraph() {
|
||||||
|
Plotly.plot("liveGraph", [
|
||||||
|
{
|
||||||
|
x: this.timeArray, // Use timeArray as x values
|
||||||
|
y: this.valueArray,
|
||||||
|
mode: "lines",
|
||||||
|
line: { color: "#80CAF6" },
|
||||||
|
name: "Temperature",
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Function to update the graph with new values
|
||||||
|
updateGraph() {
|
||||||
|
let time = new Date();
|
||||||
|
this.timeArray.push(new Date());
|
||||||
|
this.valueArray.push(Math.random());
|
||||||
|
let update = {
|
||||||
|
x: [[this.timeArray]],
|
||||||
|
y: [[this.valueArray]],
|
||||||
|
};
|
||||||
|
let olderTime = time.setMinutes(time.getMinutes() - 1);
|
||||||
|
let futureTime = time.setMinutes(time.getMinutes() + 1);
|
||||||
|
let minuteView = {
|
||||||
|
xaxis: {
|
||||||
|
type: "date",
|
||||||
|
range: [olderTime, futureTime],
|
||||||
|
},
|
||||||
|
};
|
||||||
|
Plotly.relayout("liveGraph", minuteView);
|
||||||
|
if (this.cnt === 10) clearInterval(interval);
|
||||||
|
}
|
||||||
|
}
|
Reference in New Issue
Block a user