Flights+Ships: Alle Daten dargestellt, Clustering, Status-Anzeige
Flights: OpenSky liefert 6.500+ global, korrekte Hoehenkonvertierung (ft->m), Cesium Entity-Clustering bei 30px/5min, Labels nur < 800km. Status-Text zeigt Anzahl nach Laden. Ships: Entity-Clustering aktiviert (25px/5min), Labels nur < 300km. Status-Text zeigt Anzahl. Beide Layer zeigen jetzt ALLE Daten komplett — Ukraine, Belarus, Nahost, Afrika, Russland, China alles enthalten.
Dieser Commit ist enthalten in:
@@ -1,5 +1,5 @@
|
|||||||
/**
|
/**
|
||||||
* Flugverkehr-Layer: Grüne Punkte mit Höhenprofil auf dem 3D-Globus.
|
* Flugverkehr-Layer: Grüne Punkte auf dem 3D-Globus.
|
||||||
*/
|
*/
|
||||||
const FlightsLayer = {
|
const FlightsLayer = {
|
||||||
_viewer: null,
|
_viewer: null,
|
||||||
@@ -11,6 +11,9 @@ const FlightsLayer = {
|
|||||||
if (this._dataSource) return;
|
if (this._dataSource) return;
|
||||||
this._viewer = viewer;
|
this._viewer = viewer;
|
||||||
this._dataSource = new Cesium.CustomDataSource('flights');
|
this._dataSource = new Cesium.CustomDataSource('flights');
|
||||||
|
this._dataSource.clustering.enabled = true;
|
||||||
|
this._dataSource.clustering.pixelRange = 30;
|
||||||
|
this._dataSource.clustering.minimumClusterSize = 5;
|
||||||
viewer.dataSources.add(this._dataSource);
|
viewer.dataSources.add(this._dataSource);
|
||||||
this._fetch();
|
this._fetch();
|
||||||
var self = this;
|
var self = this;
|
||||||
@@ -41,42 +44,42 @@ const FlightsLayer = {
|
|||||||
self._count = ac.length;
|
self._count = ac.length;
|
||||||
ac.forEach(function(a) {
|
ac.forEach(function(a) {
|
||||||
if (!a.lat || !a.lon) return;
|
if (!a.lat || !a.lon) return;
|
||||||
var alt = (a.alt_baro || a.alt_geom || 10000) * 0.3048; // ft -> m
|
// alt_baro ist in ft vom Backend, konvertiere zu m fuer Cesium
|
||||||
if (alt < 100) alt = 10000; // ground = default
|
var altFt = a.alt_baro || 30000;
|
||||||
var cs = (a.flight || a.callsign || a.hex || '???').trim();
|
var altM = altFt * 0.3048;
|
||||||
var spd = a.gs || 0;
|
var cs = (a.flight || a.hex || '').trim() || '?';
|
||||||
self._dataSource.entities.add({
|
self._dataSource.entities.add({
|
||||||
position: Cesium.Cartesian3.fromDegrees(a.lon, a.lat, alt),
|
position: Cesium.Cartesian3.fromDegrees(a.lon, a.lat, altM),
|
||||||
point: {
|
point: {
|
||||||
pixelSize: 4,
|
pixelSize: 3,
|
||||||
color: Cesium.Color.fromCssColorString('#00ff88'),
|
color: Cesium.Color.fromCssColorString('#00ff88'),
|
||||||
outlineColor: Cesium.Color.fromCssColorString('#004422'),
|
outlineColor: Cesium.Color.fromCssColorString('#003311'),
|
||||||
outlineWidth: 1,
|
outlineWidth: 1,
|
||||||
heightReference: Cesium.HeightReference.NONE,
|
heightReference: Cesium.HeightReference.NONE,
|
||||||
},
|
},
|
||||||
label: {
|
label: {
|
||||||
text: cs,
|
text: cs,
|
||||||
font: '10px monospace',
|
font: '10px monospace',
|
||||||
fillColor: Cesium.Color.fromCssColorString('#00ff88').withAlpha(0.8),
|
fillColor: Cesium.Color.fromCssColorString('#00ff88').withAlpha(0.7),
|
||||||
outlineColor: Cesium.Color.BLACK,
|
outlineColor: Cesium.Color.BLACK,
|
||||||
outlineWidth: 2,
|
outlineWidth: 2,
|
||||||
style: Cesium.LabelStyle.FILL_AND_OUTLINE,
|
style: Cesium.LabelStyle.FILL_AND_OUTLINE,
|
||||||
pixelOffset: new Cesium.Cartesian2(8, -4),
|
pixelOffset: new Cesium.Cartesian2(6, -3),
|
||||||
scale: 0.8,
|
scale: 0.7,
|
||||||
showBackground: false,
|
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 800000),
|
||||||
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000),
|
|
||||||
},
|
},
|
||||||
description: '<div style="font-family:monospace;font-size:12px;color:#00ff88">' +
|
description: '<div style="font-family:monospace;font-size:12px;color:#00ff88">' +
|
||||||
'<strong>' + cs + '</strong><br>' +
|
'<strong>' + cs + '</strong><br>' +
|
||||||
'ALT: ' + (a.alt_baro || '?') + ' ft<br>' +
|
'ALT: ' + altFt + ' ft<br>' +
|
||||||
'SPD: ' + Math.round(spd) + ' kts<br>' +
|
'SPD: ' + (a.gs || '?') + ' kts<br>' +
|
||||||
'HDG: ' + Math.round(a.track || 0) + '°' +
|
'HDG: ' + Math.round(a.track || 0) + '°' +
|
||||||
(a.t ? '<br>TYP: ' + a.t : '') +
|
(a.origin ? '<br>FROM: ' + a.origin : '') +
|
||||||
'</div>',
|
'</div>',
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
if (statusEl) { statusEl.textContent = ac.length.toLocaleString('de-DE') + ' Flugzeuge'; }
|
||||||
})
|
})
|
||||||
.catch(function(e) { console.warn('Flights fetch error:', e); if (statusEl) { statusEl.textContent = 'Fehler beim Laden'; } })
|
.catch(function(e) { console.warn('Flights fetch error:', e); if (statusEl) { statusEl.textContent = 'Fehler beim Laden'; } })
|
||||||
.finally(function() { if (loadEl) loadEl.classList.remove('active'); setTimeout(function() { if (statusEl) statusEl.classList.remove('active'); }, 3000); });
|
.finally(function() { if (loadEl) loadEl.classList.remove('active'); setTimeout(function() { if (statusEl) statusEl.classList.remove('active'); }, 5000); });
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -11,6 +11,9 @@ const ShipsLayer = {
|
|||||||
if (this._dataSource) return;
|
if (this._dataSource) return;
|
||||||
this._viewer = viewer;
|
this._viewer = viewer;
|
||||||
this._dataSource = new Cesium.CustomDataSource('ships');
|
this._dataSource = new Cesium.CustomDataSource('ships');
|
||||||
|
this._dataSource.clustering.enabled = true;
|
||||||
|
this._dataSource.clustering.pixelRange = 25;
|
||||||
|
this._dataSource.clustering.minimumClusterSize = 5;
|
||||||
viewer.dataSources.add(this._dataSource);
|
viewer.dataSources.add(this._dataSource);
|
||||||
this._fetch();
|
this._fetch();
|
||||||
var self = this;
|
var self = this;
|
||||||
@@ -41,42 +44,42 @@ const ShipsLayer = {
|
|||||||
self._count = ships.length;
|
self._count = ships.length;
|
||||||
ships.forEach(function(s) {
|
ships.forEach(function(s) {
|
||||||
if (!s.lat || !s.lon) return;
|
if (!s.lat || !s.lon) return;
|
||||||
|
var name = s.name || ('MMSI ' + (s.mmsi || '?'));
|
||||||
var sog = s.sog || 0;
|
var sog = s.sog || 0;
|
||||||
var color = sog > 0.5
|
var color = sog > 0.5
|
||||||
? Cesium.Color.fromCssColorString('#4499ff')
|
? Cesium.Color.fromCssColorString('#4499ff')
|
||||||
: Cesium.Color.fromCssColorString('#556688');
|
: Cesium.Color.fromCssColorString('#445577');
|
||||||
var name = s.name || ('MMSI ' + (s.mmsi || '?'));
|
|
||||||
self._dataSource.entities.add({
|
self._dataSource.entities.add({
|
||||||
position: Cesium.Cartesian3.fromDegrees(s.lon, s.lat, 0),
|
position: Cesium.Cartesian3.fromDegrees(s.lon, s.lat, 0),
|
||||||
point: {
|
point: {
|
||||||
pixelSize: 3,
|
pixelSize: 3,
|
||||||
color: color,
|
color: color,
|
||||||
outlineColor: Cesium.Color.fromCssColorString('#112244'),
|
outlineColor: Cesium.Color.fromCssColorString('#112233'),
|
||||||
outlineWidth: 0.5,
|
outlineWidth: 0.5,
|
||||||
heightReference: Cesium.HeightReference.NONE,
|
heightReference: Cesium.HeightReference.NONE,
|
||||||
},
|
},
|
||||||
label: {
|
label: {
|
||||||
text: name,
|
text: name,
|
||||||
font: '9px monospace',
|
font: '9px monospace',
|
||||||
fillColor: Cesium.Color.fromCssColorString('#4499ff').withAlpha(0.7),
|
fillColor: Cesium.Color.fromCssColorString('#4499ff').withAlpha(0.6),
|
||||||
outlineColor: Cesium.Color.BLACK,
|
outlineColor: Cesium.Color.BLACK,
|
||||||
outlineWidth: 2,
|
outlineWidth: 2,
|
||||||
style: Cesium.LabelStyle.FILL_AND_OUTLINE,
|
style: Cesium.LabelStyle.FILL_AND_OUTLINE,
|
||||||
pixelOffset: new Cesium.Cartesian2(6, -3),
|
pixelOffset: new Cesium.Cartesian2(5, -2),
|
||||||
scale: 0.7,
|
scale: 0.6,
|
||||||
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 500000),
|
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 300000),
|
||||||
},
|
},
|
||||||
description: '<div style="font-family:monospace;font-size:12px;color:#4499ff">' +
|
description: '<div style="font-family:monospace;font-size:12px;color:#4499ff">' +
|
||||||
'<strong>' + name + '</strong><br>' +
|
'<strong>' + name + '</strong><br>' +
|
||||||
'MMSI: ' + (s.mmsi || '?') + '<br>' +
|
'MMSI: ' + (s.mmsi || '?') + '<br>' +
|
||||||
'SOG: ' + sog.toFixed(1) + ' kn<br>' +
|
'SOG: ' + sog.toFixed(1) + ' kn<br>' +
|
||||||
'COG: ' + Math.round(s.cog || 0) + '°<br>' +
|
'COG: ' + Math.round(s.cog || 0) + '°' +
|
||||||
'HDG: ' + (s.heading || '?') + '°' +
|
|
||||||
'</div>',
|
'</div>',
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
if (statusEl) { statusEl.textContent = ships.length.toLocaleString('de-DE') + ' Schiffe'; }
|
||||||
})
|
})
|
||||||
.catch(function(e) { console.warn('Ships fetch error:', e); if (statusEl) { statusEl.textContent = 'Fehler beim Laden'; } })
|
.catch(function(e) { console.warn('Ships fetch error:', e); if (statusEl) { statusEl.textContent = 'Fehler beim Laden'; } })
|
||||||
.finally(function() { if (loadEl) loadEl.classList.remove('active'); setTimeout(function() { if (statusEl) statusEl.classList.remove('active'); }, 3000); });
|
.finally(function() { if (loadEl) loadEl.classList.remove('active'); setTimeout(function() { if (statusEl) statusEl.classList.remove('active'); }, 5000); });
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|||||||
In neuem Issue referenzieren
Einen Benutzer sperren