AegisSight/AegisSight-Monitor
3
0
Fork 0
Code Issues Pull-Requests Actions Pakete Projekte Releases Wiki Aktivität

Fix: Karte nicht sichtbar - Container-Hoehe in gridstack korrigiert

Quellcode durchsuchen 
- map-card: position absolute + inset 0 (zuverlaessig in gridstack)
- map-container: min-height 0 statt 200px (flex-Item braucht das)
- map-empty: position absolute statt flex-basiert
- invalidateSize mit mehreren Retries (100/300/800ms)
- Bounds werden nach invalidateSize erneut gesetzt

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Dieser Commit ist enthalten in:
claude-dev
2026-03-04 22:48:43 +01:00
Ursprung 75df9fc66d
Commit 8ff4f5618f
3 geänderte Dateien mit 25 neuen und 12 gelöschten Zeilen
Patch-Datei herunterladen Vergleichs-Datei herunterladen Alle Dateien ausklappen Alle Dateien einklappen

10
src/static/css/style.css
Datei anzeigen

@@ -4145,9 +4145,11 @@ a:hover {
/* === Karten-Kachel (Leaflet) === */ /* === Karten-Kachel (Leaflet) === */
.map-card { .map-card {
position: absolute;
inset: 0;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
height: 100%; overflow: hidden;
} }
.map-card .card-header { .map-card .card-header {
flex-shrink: 0; flex-shrink: 0;
@@ -4159,16 +4161,16 @@ a:hover {
} }
.map-container { .map-container {
flex: 1; flex: 1;
min-height: 200px;
position: relative; position: relative;
z-index: 1; z-index: 1;
min-height: 0;
} }
.map-empty { .map-empty {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
height: 100%; position: absolute;
min-height: 200px; inset: 0;
color: var(--text-tertiary); color: var(--text-tertiary);
font-size: 13px; font-size: 13px;
font-family: var(--font-body); font-family: var(--font-body);

12
src/static/dashboard.html
Datei anzeigen

@@ -16,7 +16,7 @@
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"> <link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css">
<link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.5.3/dist/MarkerCluster.css"> <link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.5.3/dist/MarkerCluster.css">
<link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.5.3/dist/MarkerCluster.Default.css"> <link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.5.3/dist/MarkerCluster.Default.css">
<link rel="stylesheet" href="/static/css/style.css?v=20260304e"> <link rel="stylesheet" href="/static/css/style.css?v=20260304f">
</head> </head>
<body> <body>
<a href="#main-content" class="skip-link">Zum Hauptinhalt springen</a> <a href="#main-content" class="skip-link">Zum Hauptinhalt springen</a>
@@ -560,10 +560,10 @@
<script src="https://cdn.jsdelivr.net/npm/gridstack@12/dist/gridstack-all.js"></script> <script src="https://cdn.jsdelivr.net/npm/gridstack@12/dist/gridstack-all.js"></script>
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script> <script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
<script src="https://unpkg.com/leaflet.markercluster@1.5.3/dist/leaflet.markercluster.js"></script> <script src="https://unpkg.com/leaflet.markercluster@1.5.3/dist/leaflet.markercluster.js"></script>
<script src="/static/js/api.js?v=20260304e"></script> <script src="/static/js/api.js?v=20260304f"></script>
<script src="/static/js/ws.js?v=20260304e"></script> <script src="/static/js/ws.js?v=20260304f"></script>
<script src="/static/js/components.js?v=20260304e"></script> <script src="/static/js/components.js?v=20260304f"></script>
<script src="/static/js/layout.js?v=20260304e"></script> <script src="/static/js/layout.js?v=20260304f"></script>
<script src="/static/js/app.js?v=20260304e"></script> <script src="/static/js/app.js?v=20260304f"></script>
</body> </body>
</html> </html>

15
src/static/js/components.js
Datei anzeigen

@@ -707,8 +707,19 @@ const UI = {
} }
} }
// Resize-Fix fuer gridstack // Resize-Fix fuer gridstack (mehrere Versuche, da Container-Hoehe erst spaeter steht)
setTimeout(() => { if (this._map) this._map.invalidateSize(); }, 200); const self = this;
[100, 300, 800].forEach(delay => {
setTimeout(() => {
if (!self._map) return;
self._map.invalidateSize();
if (bounds.length === 1) {
self._map.setView(bounds[0], 8);
} else if (bounds.length > 1) {
self._map.fitBounds(bounds, { padding: [30, 30], maxZoom: 12 });
}
}, delay);
});
}, },
_applyMapTiles() { _applyMapTiles() {