diff --git a/web-client/client.html b/web-client/client.html
index ea9728f..a8d94fb 100644
--- a/web-client/client.html
+++ b/web-client/client.html
@@ -583,8 +583,9 @@
}
}
- // Визуализация на canvas — рисуем RMS от satellite
- let satelliteRmsHistory = new Array(64).fill(0); // История RMS значений
+ // Визуализация на canvas — рисуем RMS от satellite с красивой анимацией
+ let satelliteRmsHistory = new Array(42).fill(0); // История RMS значений
+ let rmsSmoothed = 0; // Сглаженное значение
function drawSatelliteVisualization() {
if(!ctx) return;
@@ -600,26 +601,35 @@
return;
}
- // Добавляем текущее RMS в историю
+ // Добавляем текущее RMS в историю (сглаживание)
+ rmsSmoothed = rmsSmoothed * 0.7 + currentRms * 0.3;
satelliteRmsHistory.shift();
- satelliteRmsHistory.push(currentRms);
+ satelliteRmsHistory.push(rmsSmoothed);
// Рисуем
ctx.clearRect(0,0,canvas.width, canvas.height);
ctx.fillStyle = '#03151f';
ctx.fillRect(0,0,canvas.width, canvas.height);
- const barWidth = (canvas.width / satelliteRmsHistory.length);
+ const barWidth = (canvas.width / 42);
- for(let i=0; i 0.3) barHeight = rms * canvas.height * 1.8 * (Math.sin(i*0.3)+1.2);
+
+ barHeight = Math.min(barHeight, canvas.height-10);
+ const x = i * (barWidth+2);
+
+ // Градиент как в оригинале
+ const grad = ctx.createLinearGradient(x, canvas.height-barHeight, x, canvas.height);
+ grad.addColorStop(0, '#0ff');
+ grad.addColorStop(1, '#3f87ff');
+ ctx.fillStyle = grad;
+ ctx.fillRect(x, canvas.height-barHeight, barWidth, barHeight);
}
}