Update online.html
Browse files- online.html +60 -7
online.html
CHANGED
@@ -477,7 +477,6 @@ document.getElementById("but_sliv").addEventListener("click", function() {
|
|
477 |
|
478 |
|
479 |
|
480 |
-
|
481 |
<script>
|
482 |
// Объект для хранения истории данных
|
483 |
let dataHistory = {
|
@@ -486,13 +485,16 @@ document.getElementById("but_sliv").addEventListener("click", function() {
|
|
486 |
times: [],
|
487 |
ph: [],
|
488 |
ec: [],
|
|
|
|
|
|
|
489 |
tS: [],
|
490 |
tA: [],
|
491 |
hDm: [],
|
492 |
sVen: []
|
493 |
};
|
494 |
|
495 |
-
// Максимальное количество точек (по умолчанию
|
496 |
let maxPoints = 60;
|
497 |
|
498 |
// Инициализация графика Plotly
|
@@ -532,6 +534,42 @@ document.getElementById("but_sliv").addEventListener("click", function() {
|
|
532 |
hoverlabel: { bgcolor: "green", font: { color: "white" } },
|
533 |
visible: "legendonly"
|
534 |
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
535 |
{
|
536 |
x: dataHistory.labels,
|
537 |
y: dataHistory.tS,
|
@@ -617,6 +655,9 @@ document.getElementById("but_sliv").addEventListener("click", function() {
|
|
617 |
dataHistory.times.push(data.time);
|
618 |
dataHistory.ph.push(parseFloat(data.ph) || 0);
|
619 |
dataHistory.ec.push(parseFloat(data.ec) || 0);
|
|
|
|
|
|
|
620 |
dataHistory.tS.push(parseFloat(data.tS) || 0);
|
621 |
dataHistory.tA.push(parseFloat(data.tA) || 0);
|
622 |
dataHistory.hDm.push(parseFloat(data.hDm) || 0);
|
@@ -629,6 +670,9 @@ document.getElementById("but_sliv").addEventListener("click", function() {
|
|
629 |
dataHistory.times.shift();
|
630 |
dataHistory.ph.shift();
|
631 |
dataHistory.ec.shift();
|
|
|
|
|
|
|
632 |
dataHistory.tS.shift();
|
633 |
dataHistory.tA.shift();
|
634 |
dataHistory.hDm.shift();
|
@@ -648,11 +692,17 @@ document.getElementById("but_sliv").addEventListener("click", function() {
|
|
648 |
dataHistory.labels,
|
649 |
dataHistory.labels,
|
650 |
dataHistory.labels,
|
651 |
-
dataHistory.labels
|
|
|
|
|
|
|
652 |
],
|
653 |
y: [
|
654 |
dataHistory.ph,
|
655 |
dataHistory.ec,
|
|
|
|
|
|
|
656 |
dataHistory.tS,
|
657 |
dataHistory.tA,
|
658 |
dataHistory.hDm,
|
@@ -664,7 +714,10 @@ document.getElementById("but_sliv").addEventListener("click", function() {
|
|
664 |
customdata,
|
665 |
customdata,
|
666 |
customdata,
|
667 |
-
customdata
|
|
|
|
|
|
|
668 |
]
|
669 |
});
|
670 |
}
|
@@ -692,6 +745,9 @@ document.getElementById("but_sliv").addEventListener("click", function() {
|
|
692 |
dataHistory.times.shift();
|
693 |
dataHistory.ph.shift();
|
694 |
dataHistory.ec.shift();
|
|
|
|
|
|
|
695 |
dataHistory.tS.shift();
|
696 |
dataHistory.tA.shift();
|
697 |
dataHistory.hDm.shift();
|
@@ -709,9 +765,6 @@ document.getElementById("but_sliv").addEventListener("click", function() {
|
|
709 |
};
|
710 |
</script>
|
711 |
|
712 |
-
|
713 |
-
|
714 |
-
|
715 |
|
716 |
</body>
|
717 |
</html>
|
|
|
477 |
|
478 |
|
479 |
|
|
|
480 |
<script>
|
481 |
// Объект для хранения истории данных
|
482 |
let dataHistory = {
|
|
|
485 |
times: [],
|
486 |
ph: [],
|
487 |
ec: [],
|
488 |
+
ec_A_eep: [], // Насос A
|
489 |
+
ec_B_eep: [], // Насос B
|
490 |
+
ec_C_eep: [], // Насос C
|
491 |
tS: [],
|
492 |
tA: [],
|
493 |
hDm: [],
|
494 |
sVen: []
|
495 |
};
|
496 |
|
497 |
+
// Максимальное количество точек (по умолчанию 60)
|
498 |
let maxPoints = 60;
|
499 |
|
500 |
// Инициализация графика Plotly
|
|
|
534 |
hoverlabel: { bgcolor: "green", font: { color: "white" } },
|
535 |
visible: "legendonly"
|
536 |
},
|
537 |
+
{
|
538 |
+
x: dataHistory.labels,
|
539 |
+
y: dataHistory.ec_A_eep,
|
540 |
+
name: "Насос A",
|
541 |
+
mode: "lines+markers",
|
542 |
+
line: { color: "#00CED1" }, // Бирюзовый
|
543 |
+
marker: { size: 6 },
|
544 |
+
customdata: dataHistory.dates.map((date, i) => [date, dataHistory.times[i]]),
|
545 |
+
hovertemplate: "<b>Насос A: %{y}</b><br>Дата: %{customdata[0]}<br>Время: %{customdata[1]}<extra></extra>",
|
546 |
+
hoverlabel: { bgcolor: "#00CED1", font: { color: "white" } },
|
547 |
+
visible: "legendonly"
|
548 |
+
},
|
549 |
+
{
|
550 |
+
x: dataHistory.labels,
|
551 |
+
y: dataHistory.ec_B_eep,
|
552 |
+
name: "Насос B",
|
553 |
+
mode: "lines+markers",
|
554 |
+
line: { color: "#FF1493" }, // Розовый
|
555 |
+
marker: { size: 6 },
|
556 |
+
customdata: dataHistory.dates.map((date, i) => [date, dataHistory.times[i]]),
|
557 |
+
hovertemplate: "<b>Насос B: %{y}</b><br>Дата: %{customdata[0]}<br>Время: %{customdata[1]}<extra></extra>",
|
558 |
+
hoverlabel: { bgcolor: "#FF1493", font: { color: "white" } },
|
559 |
+
visible: "legendonly"
|
560 |
+
},
|
561 |
+
{
|
562 |
+
x: dataHistory.labels,
|
563 |
+
y: dataHistory.ec_C_eep,
|
564 |
+
name: "Насос C",
|
565 |
+
mode: "lines+markers",
|
566 |
+
line: { color: "#FFD700" }, // Золотой
|
567 |
+
marker: { size: 6 },
|
568 |
+
customdata: dataHistory.dates.map((date, i) => [date, dataHistory.times[i]]),
|
569 |
+
hovertemplate: "<b>Насос C: %{y}</b><br>Дата: %{customdata[0]}<br>Время: %{customdata[1]}<extra></extra>",
|
570 |
+
hoverlabel: { bgcolor: "#FFD700", font: { color: "white" } },
|
571 |
+
visible: "legendonly"
|
572 |
+
},
|
573 |
{
|
574 |
x: dataHistory.labels,
|
575 |
y: dataHistory.tS,
|
|
|
655 |
dataHistory.times.push(data.time);
|
656 |
dataHistory.ph.push(parseFloat(data.ph) || 0);
|
657 |
dataHistory.ec.push(parseFloat(data.ec) || 0);
|
658 |
+
dataHistory.ec_A_eep.push(parseFloat(data.ec_A_eep) || 0); // Насос A
|
659 |
+
dataHistory.ec_B_eep.push(parseFloat(data.ec_B_eep) || 0); // Насос B
|
660 |
+
dataHistory.ec_C_eep.push(parseFloat(data.ec_C_eep) || 0); // Насос C
|
661 |
dataHistory.tS.push(parseFloat(data.tS) || 0);
|
662 |
dataHistory.tA.push(parseFloat(data.tA) || 0);
|
663 |
dataHistory.hDm.push(parseFloat(data.hDm) || 0);
|
|
|
670 |
dataHistory.times.shift();
|
671 |
dataHistory.ph.shift();
|
672 |
dataHistory.ec.shift();
|
673 |
+
dataHistory.ec_A_eep.shift(); // Насос A
|
674 |
+
dataHistory.ec_B_eep.shift(); // Насос B
|
675 |
+
dataHistory.ec_C_eep.shift(); // Насос C
|
676 |
dataHistory.tS.shift();
|
677 |
dataHistory.tA.shift();
|
678 |
dataHistory.hDm.shift();
|
|
|
692 |
dataHistory.labels,
|
693 |
dataHistory.labels,
|
694 |
dataHistory.labels,
|
695 |
+
dataHistory.labels,
|
696 |
+
dataHistory.labels, // Для Насос A
|
697 |
+
dataHistory.labels, // Для Насос B
|
698 |
+
dataHistory.labels // Для Насос C
|
699 |
],
|
700 |
y: [
|
701 |
dataHistory.ph,
|
702 |
dataHistory.ec,
|
703 |
+
dataHistory.ec_A_eep, // Насос A
|
704 |
+
dataHistory.ec_B_eep, // Насос B
|
705 |
+
dataHistory.ec_C_eep, // Насос C
|
706 |
dataHistory.tS,
|
707 |
dataHistory.tA,
|
708 |
dataHistory.hDm,
|
|
|
714 |
customdata,
|
715 |
customdata,
|
716 |
customdata,
|
717 |
+
customdata,
|
718 |
+
customdata, // Для Насос A
|
719 |
+
customdata, // Для Насос B
|
720 |
+
customdata // Для Насос C
|
721 |
]
|
722 |
});
|
723 |
}
|
|
|
745 |
dataHistory.times.shift();
|
746 |
dataHistory.ph.shift();
|
747 |
dataHistory.ec.shift();
|
748 |
+
dataHistory.ec_A_eep.shift(); // Насос A
|
749 |
+
dataHistory.ec_B_eep.shift(); // Насос B
|
750 |
+
dataHistory.ec_C_eep.shift(); // Насос C
|
751 |
dataHistory.tS.shift();
|
752 |
dataHistory.tA.shift();
|
753 |
dataHistory.hDm.shift();
|
|
|
765 |
};
|
766 |
</script>
|
767 |
|
|
|
|
|
|
|
768 |
|
769 |
</body>
|
770 |
</html>
|