Update status page

This commit is contained in:
Anton Roslund
2025-02-23 13:06:15 +01:00
parent 02c9913a05
commit cd4eb6d411
2 changed files with 20 additions and 40 deletions
+9 -40
View File
@@ -5,51 +5,20 @@ menu: {main: {weight: 12}}
draft: false
---
{{% blocks/cover title="Mesh Status Metrics" image_anchor="top" height="min" %}}
Grafer och statistic specifikt för Stockholm's meshen.
{{% /blocks/cover %}}
{{% blocks/section color="white" %}}
## STHLM-MESH Channel utilization
Genomsnittlig Ch.utl i Stockholm senaste 12 timmarna. Notera att många noder inte sender telemetri när channel utilization är för (25%+) detta gör grafen något missvisande. Men gränsvärdena i grafen visar ändå hur meshen mår över tid.
## Kanalutnyttjande
Den genomsnittliga kanalutnyttjandet i Stockholm under de senaste 12 timmarna. Observera att många noder slutar skicka telemetri vid hög belastning (över 25 %), vilket kan påverka grafens noggrannhet. Trots detta ger gränsvärdena i grafen en god indikation på nätverkets hälsa över tid.
<style>
.img-container {
position: relative;
width: 100%;
max-width: 774px; /* Ensures it scales with the parent container */
height: auto; /* Let the height adjust based on width */
aspect-ratio: 774/387; /* Maintains aspect ratio */
background-color: #e0e0e0; /* Placeholder color */
display: flex;
align-items: center;
justify-content: center;
overflow: hidden; /* Ensures no overflow issues */
}
{{< lazy-img max-width="774px" aspect-ratio="774/387"
src="https://dash.roslund.cloud/render/d-solo/edqkge9mf7v28g/main-dashboard?orgId=1&theme=light&panelId=23&width=774&height=387&scale=1" >}}
.img-container img {
position: absolute;
width: 100%;
height: 100%;
object-fit: cover;
transition: opacity 0.5s ease-in-out;
}
.img-container img.lazy {
opacity: 0;
}
.img-container img.loaded {
opacity: 1;
}
</style>
<div class="img-container">
<!-- Bootstrap spinner -->
<div class="spinner-border text-primary" role="status">
<span class="visually-hidden">Loading...</span>
</div>
<!-- Lazy-loaded image -->
<img src="https://dash.roslund.cloud/render/d-solo/edqkge9mf7v28g/main-dashboard?orgId=1&theme=light&panelId=23&width=1000&height=500&scale=1" class="lazy" loading="lazy" alt="Lazy Image" onload="this.classList.add('loaded'); this.previousElementSibling.style.display='none';">
</div>
## Packet typer
Fördelningen av olika pakettyper i nätverket under de senaste 12 timmarna. Diagrammet visar hur nätverket används, inklusive meddelanden, positionstelemetri och andra systempaket.
{{< lazy-img max-width="500px" aspect-ratio="1/1"
src="https://dash.roslund.cloud/render/d-solo/edqkge9mf7v28g/main-dashboard?orgId=1&theme=light&panelId=5&width=500&height=500&scale=1" >}}
{{% /blocks/section %}}
+11
View File
@@ -0,0 +1,11 @@
<!-- stylelint-disable -->
<div class="lazy-img-container" style='max-width: {{ .Get "max-width" }}; aspect-ratio: {{ .Get "aspect-ratio" | safeCSS }};'>
<!-- Bootstrap spinner -->
<div class="spinner-border text-primary" role="status">
<span class="visually-hidden">Loading...</span>
</div>
<!-- Lazy-loaded image -->
<img src='{{ .Get "src" }}' class="lazy" loading="lazy" onload="this.classList.add('loaded'); this.previousElementSibling.style.display='none';">
</div>