Dateien
AegisSight-Globe/static/js/layers/disasters.js
Claude Dev 68387f89fd OSINT Monitor Layer + Erdbeben in Katastrophen zusammengefuehrt
MONITOR LAYER (neu):
- Neuer Top-Layer "OSINT Monitor" im Panel
- Zeigt geoparsete Standorte aus Monitor-Lagen auf dem Globus
- Farbkodiert: rot=Hauptgeschehen, orange=Reaktionen, blau=Beteiligte
- Labels mit Ortsname + Artikelanzahl bei Zoom
- 2min Refresh, GeoJSON vom Monitor Public API

KATASTROPHEN (erweitert):
- Erdbeben-Layer in Katastrophen integriert (kein separater Toggle mehr)
- Laedt NASA EONET + USGS parallel
- Erdbeben als farbige Punkte (rot=frisch, gelb=alt) mit M-Label
- Katastrophen-Toggle zeigt jetzt alles: Waldbraende, Vulkane,
  Stuerme, Fluten UND Erdbeben
2026-03-24 13:11:34 +01:00

147 Zeilen
6.8 KiB
JavaScript

/**
* Naturkatastrophen-Layer: NASA EONET (Waldbrände, Vulkane, Stürme, Eis).
*/
const DisastersLayer = {
_viewer: null,
_dataSource: null,
_interval: null,
_count: 0,
start(viewer) {
if (this._dataSource) return;
this._viewer = viewer;
this._dataSource = new Cesium.CustomDataSource('disasters');
viewer.dataSources.add(this._dataSource);
this._fetch();
var self = this;
this._interval = setInterval(function() { self._fetch(); }, 600000);
},
stop() {
if (this._interval) { clearInterval(this._interval); this._interval = null; }
if (this._dataSource && this._viewer) { this._viewer.dataSources.remove(this._dataSource); this._dataSource = null; }
this._count = 0;
},
_fetch() {
var self = this;
var loadEl = document.getElementById('loading-disasters');
var statusEl = document.getElementById('status-disasters');
if (loadEl) loadEl.classList.add('active');
if (statusEl) { statusEl.textContent = 'Lade Ereignisse + Erdbeben...'; statusEl.classList.add('active'); }
// Lade beides parallel: NASA EONET + USGS Erdbeben
Promise.all([
fetch('/api/disasters').then(function(r) { return r.json(); }).catch(function() { return {events:[]}; }),
fetch('/api/quakes').then(function(r) { return r.json(); }).catch(function() { return {features:[]}; }),
])
.then(function(results) {
var eonetData = results[0];
var quakeData = results[1];
self._renderAll(eonetData, quakeData);
var total = (eonetData.events || []).length + (quakeData.features || []).length;
self._count = total;
if (statusEl) statusEl.textContent = total + ' Ereignisse';
})
.catch(function(e) { console.warn('Disasters error:', e); if (statusEl) statusEl.textContent = 'Fehler'; })
.finally(function() { if (loadEl) loadEl.classList.remove('active'); setTimeout(function() { if (statusEl) statusEl.classList.remove('active'); }, 5000); });
},
_renderAll(eonetData, quakeData) {
if (!this._dataSource) return;
this._dataSource.entities.removeAll();
// NASA EONET Events
var events = eonetData.events || [];
this._renderEonet(events);
// USGS Erdbeben
var quakes = quakeData.features || [];
this._renderQuakes(quakes);
},
_renderEonet(events) {
var self = this;
.then(function(r) { return r.json(); })
var icons = {
'wildfires': { color: '#ff4400', symbol: '🔥', label: 'Waldbrand' },
'volcanoes': { color: '#ff0000', symbol: '🌋', label: 'Vulkan' },
'severeStorms': { color: '#aa44ff', symbol: '🌀', label: 'Sturm' },
'floods': { color: '#4488ff', symbol: '🌊', label: 'Flut' },
'earthquakes': { color: '#ffaa00', symbol: '⚡', label: 'Erdbeben' },
'seaLakeIce': { color: '#88ddff', symbol: '❄️', label: 'Eis' },
'landslides': { color: '#886644', symbol: '⛰️', label: 'Erdrutsch' },
};
events.forEach(function(evt) {
var cats = evt.categories || [];
var catId = cats.length ? cats[0].id : 'unknown';
var icon = icons[catId] || { color: '#ffffff', symbol: '⚠️', label: catId };
var geom = evt.geometry || [];
if (!geom.length) return;
var latest = geom[geom.length - 1];
var coords = latest.coordinates;
if (!coords || coords.length < 2) return;
var lon = coords[0], lat = coords[1];
self._dataSource.entities.add({
position: Cesium.Cartesian3.fromDegrees(lon, lat, 0),
point: {
pixelSize: 8,
color: Cesium.Color.fromCssColorString(icon.color),
outlineColor: Cesium.Color.fromCssColorString(icon.color).withAlpha(0.4),
outlineWidth: 3,
heightReference: Cesium.HeightReference.NONE,
},
label: {
text: icon.symbol,
font: '14px sans-serif',
pixelOffset: new Cesium.Cartesian2(0, -14),
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 5000000),
},
description: '<div style="font-family:monospace;font-size:13px;padding:8px">' +
'<strong style="color:' + icon.color + '">' + icon.label.toUpperCase() + '</strong><br>' +
'<span style="color:#e0e0e0">' + (evt.title || '?') + '</span><br>' +
'<span style="color:#888">Quellen: ' + (evt.sources || []).map(function(s) { return s.id; }).join(', ') + '</span>' +
'</div>',
});
});
},
_renderQuakes(features) {
var self = this;
var now = Date.now();
features.forEach(function(f) {
var c = f.geometry.coordinates;
var p = f.properties;
var mag = p.mag || 1;
var ageH = (now - p.time) / 3600000;
var color = ageH < 1 ? '#ff0000' : ageH < 6 ? '#ff6600' : ageH < 12 ? '#ffaa00' : '#ffdd00';
self._dataSource.entities.add({
position: Cesium.Cartesian3.fromDegrees(c[0], c[1], 0),
point: {
pixelSize: Math.max(mag * 2.5, 4),
color: Cesium.Color.fromCssColorString(color),
outlineColor: Cesium.Color.fromCssColorString(color).withAlpha(0.4),
outlineWidth: 2,
heightReference: Cesium.HeightReference.NONE,
},
label: {
text: 'M' + mag.toFixed(1),
font: '10px monospace',
fillColor: Cesium.Color.fromCssColorString(color),
outlineColor: Cesium.Color.BLACK,
outlineWidth: 2,
style: Cesium.LabelStyle.FILL_AND_OUTLINE,
pixelOffset: new Cesium.Cartesian2(0, -12),
scale: 0.7,
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000),
},
description: '<div style="font-family:monospace;font-size:13px;padding:8px">' +
'<strong style="color:' + color + '">ERDBEBEN M' + mag.toFixed(1) + '</strong><br>' +
'<span style="color:#e0e0e0">' + (p.place || '?') + '</span><br>' +
'<span style="color:#888">Tiefe: ' + (c[2] || '?') + ' km | ' +
new Date(p.time).toLocaleString('de-DE') + '</span></div>',
});
});
},
};