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

fix: Suchbereich deutlich sichtbarer

Quellcode durchsuchen 
- Kraeftigere Fuellung (0.15-0.25 statt 0.06-0.12)
- Explizite Kanten-Polylines (width 3, 90% Opazitaet)
- Aeusserer Glow-Rahmen als zweites Rechteck
- Horizontale Schraffur-Linien fuer taktischen Look
- Groessere Eckpunkte (8px, weisser Rand)
- Label: fett, 13px, mit Hintergrund-Box
- Sichtbar bis 12.000km Entfernung
Dieser Commit ist enthalten in:
Claude Dev
2026-03-26 10:28:44 +01:00
Ursprung 41a987f848
Commit 9709536036
1 geänderte Dateien mit 93 neuen und 44 gelöschten Zeilen
Patch-Datei herunterladen Vergleichs-Datei herunterladen Alle Dateien ausklappen Alle Dateien einklappen

137
static/js/ui/vlm.js
Datei anzeigen

@@ -465,41 +465,55 @@ const VlmUI = {
if (!Globe.viewer || !bbox) return;
var isSmall = (Math.abs(bbox.north - bbox.south) < 2 && Math.abs(bbox.east - bbox.west) < 2);
var fillAlpha = isSmall ? 0.12 : 0.06;
var outlineAlpha = isSmall ? 0.7 : 0.4;
// Helle, klar sichtbare Fuellung
this._searchAreaEntity = Globe.viewer.entities.add({
name: 'Suchbereich: ' + label,
rectangle: {
coordinates: Cesium.Rectangle.fromDegrees(bbox.west, bbox.south, bbox.east, bbox.north),
material: Cesium.Color.fromCssColorString('#e040fb').withAlpha(fillAlpha),
material: Cesium.Color.fromCssColorString('#e040fb').withAlpha(isSmall ? 0.25 : 0.15),
outline: true,
outlineColor: Cesium.Color.fromCssColorString('#e040fb').withAlpha(outlineAlpha),
outlineWidth: 2,
outlineColor: Cesium.Color.fromCssColorString('#e040fb'),
outlineWidth: 3,
height: 0,
},
});
// Label in der Mitte des Bereichs
var centerLat = (bbox.south + bbox.north) / 2;
var centerLon = (bbox.west + bbox.east) / 2;
this._searchAreaLabel = Globe.viewer.entities.add({
position: Cesium.Cartesian3.fromDegrees(centerLon, centerLat, 0),
label: {
text: 'SUCHBEREICH',
font: '11px monospace',
fillColor: Cesium.Color.fromCssColorString('#e040fb').withAlpha(0.7),
outlineColor: Cesium.Color.BLACK,
outlineWidth: 3,
style: Cesium.LabelStyle.FILL_AND_OUTLINE,
verticalOrigin: Cesium.VerticalOrigin.CENTER,
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, isSmall ? 500000 : 8000000),
disableDepthTestDistance: Number.POSITIVE_INFINITY,
// Zweites Rechteck leicht versetzt als Glow-Effekt
this._searchAreaGlow = Globe.viewer.entities.add({
rectangle: {
coordinates: Cesium.Rectangle.fromDegrees(
bbox.west - 0.05, bbox.south - 0.05,
bbox.east + 0.05, bbox.north + 0.05
),
material: Cesium.Color.TRANSPARENT,
outline: true,
outlineColor: Cesium.Color.fromCssColorString('#e040fb').withAlpha(0.35),
outlineWidth: 1,
height: 0,
},
});
// Eckpunkte-Markierungen
// Diagonale Linien fuer taktisches Schraffur-Gefuehl
this._searchAreaDiags = [];
var steps = isSmall ? 6 : 12;
for (var s = 1; s < steps; s++) {
var t = s / steps;
// Horizontale Linien
var lineLat = bbox.south + t * (bbox.north - bbox.south);
this._searchAreaDiags.push(Globe.viewer.entities.add({
polyline: {
positions: Cesium.Cartesian3.fromDegreesArray([
bbox.west, lineLat, bbox.east, lineLat
]),
width: 1,
material: Cesium.Color.fromCssColorString('#e040fb').withAlpha(0.08),
clampToGround: true,
},
}));
}
// Eckpunkte - groesser und heller
this._searchAreaCorners = [];
var corners = [
[bbox.west, bbox.south], [bbox.east, bbox.south],
@@ -509,16 +523,57 @@ const VlmUI = {
this._searchAreaCorners.push(Globe.viewer.entities.add({
position: Cesium.Cartesian3.fromDegrees(corners[i][0], corners[i][1], 0),
point: {
pixelSize: 4,
color: Cesium.Color.fromCssColorString('#e040fb').withAlpha(0.6),
outlineColor: Cesium.Color.BLACK,
outlineWidth: 1,
pixelSize: 8,
color: Cesium.Color.fromCssColorString('#e040fb'),
outlineColor: Cesium.Color.WHITE,
outlineWidth: 2,
disableDepthTestDistance: Number.POSITIVE_INFINITY,
},
}));
}
// Kamera auf den Bereich ausrichten wenn kein EXIF-GPS (EXIF fliegt bereits hin)
// Kantenlinien explizit als Polylines (deutlich sichtbarer als rectangle outline)
this._searchAreaEdges = [];
var edgePositions = [
[bbox.west, bbox.south, bbox.east, bbox.south],
[bbox.east, bbox.south, bbox.east, bbox.north],
[bbox.east, bbox.north, bbox.west, bbox.north],
[bbox.west, bbox.north, bbox.west, bbox.south],
];
for (var e = 0; e < edgePositions.length; e++) {
this._searchAreaEdges.push(Globe.viewer.entities.add({
polyline: {
positions: Cesium.Cartesian3.fromDegreesArray(edgePositions[e]),
width: 3,
material: Cesium.Color.fromCssColorString('#e040fb').withAlpha(0.9),
clampToGround: true,
},
}));
}
// Label - groesser und deutlicher
var centerLat = (bbox.south + bbox.north) / 2;
var centerLon = (bbox.west + bbox.east) / 2;
this._searchAreaLabel = Globe.viewer.entities.add({
position: Cesium.Cartesian3.fromDegrees(centerLon, centerLat, 0),
label: {
text: '\u25A0 SUCHBEREICH',
font: 'bold 13px monospace',
fillColor: Cesium.Color.fromCssColorString('#e040fb'),
outlineColor: Cesium.Color.BLACK,
outlineWidth: 4,
style: Cesium.LabelStyle.FILL_AND_OUTLINE,
verticalOrigin: Cesium.VerticalOrigin.CENTER,
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, isSmall ? 800000 : 12000000),
disableDepthTestDistance: Number.POSITIVE_INFINITY,
backgroundColor: Cesium.Color.fromCssColorString('#e040fb').withAlpha(0.15),
showBackground: true,
backgroundPadding: new Cesium.Cartesian2(8, 4),
},
});
// Kamera auf den Bereich ausrichten wenn kein EXIF-GPS
if (!isSmall) {
Globe.viewer.camera.flyTo({
destination: Cesium.Rectangle.fromDegrees(bbox.west - 2, bbox.south - 2, bbox.east + 2, bbox.north + 2),
@@ -528,24 +583,18 @@ const VlmUI = {
},
_clearSearchArea: function() {
if (this._searchAreaEntity && Globe.viewer) {
Globe.viewer.entities.remove(this._searchAreaEntity);
this._searchAreaEntity = null;
}
if (this._searchAreaLabel && Globe.viewer) {
Globe.viewer.entities.remove(this._searchAreaLabel);
this._searchAreaLabel = null;
}
if (this._searchAreaCorners) {
for (var i = 0; i < this._searchAreaCorners.length; i++) {
if (Globe.viewer) Globe.viewer.entities.remove(this._searchAreaCorners[i]);
}
this._searchAreaCorners = null;
}
if (this._exifMarkerEntity && Globe.viewer) {
Globe.viewer.entities.remove(this._exifMarkerEntity);
this._exifMarkerEntity = null;
var v = Globe.viewer;
if (!v) return;
var self = this;
['_searchAreaEntity', '_searchAreaGlow', '_searchAreaLabel', '_exifMarkerEntity'].forEach(function(k) {
if (self[k]) { v.entities.remove(self[k]); self[k] = null; }
});
['_searchAreaCorners', '_searchAreaEdges', '_searchAreaDiags'].forEach(function(k) {
if (self[k]) {
for (var i = 0; i < self[k].length; i++) { v.entities.remove(self[k][i]); }
self[k] = null;
}
});
},
_reset: function() {