mirror of
https://github.com/Roslund/sthlm-mesh.git
synced 2026-08-06 08:53:24 +02:00
Update status page
This commit is contained in:
@@ -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 %}}
|
||||
|
||||
|
||||
|
||||
@@ -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>
|
||||
Reference in New Issue
Block a user