From 452f651ca2d2d53ed3d25ea98cd0afc7d951d8e0 Mon Sep 17 00:00:00 2001
From: wyc <1104749580@qq.com>
Date: Fri, 21 Aug 2026 16:26:25 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E7=95=8C=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/App.tsx | 45 +++++++++++++++++++++-------------------
src/Map/Cesium_Map.tsx | 6 +++---
src/Map/WebGL_Support.ts | 2 +-
3 files changed, 28 insertions(+), 25 deletions(-)
diff --git a/src/App.tsx b/src/App.tsx
index b0eedc0..b799261 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -5,7 +5,7 @@ import enhance from './core/enhance.tsx';
import {useEffect} from 'react';
import {SettingOutlined} from '@ant-design/icons';
-import {Menu, type MenuProps, message} from 'antd';
+import {Menu, type MenuProps, message, Switch} from 'antd';
import {
BrowserRouter,
@@ -64,16 +64,10 @@ class App extends enhance.Base {
this.menuItems = [
{
- label: '2D地图',
+ label: '地图',
icon: ,
key: '/map',
},
- {
- label: this.webgl_supported ? '3D地图' : '3D地图(WebGL不可用)',
- icon: ,
- key: '/map3d',
- disabled: !this.webgl_supported,
- },
{
label: '设置',
icon: ,
@@ -117,17 +111,13 @@ class App extends enhance.Base {
this.location = useLocation();
useEffect(() => {
const path = this.location?.pathname || '/map';
- this.selected_key = path.startsWith('/ui/') ? path.substring(3) : path;
+ const route_key = path.startsWith('/ui/') ? path.substring(3) : path;
+ this.selected_key = route_key === "/map3d" ? "/map" : route_key;
this.flush()
}, [this.location]);
useEffect(() => {
const on_unavailable = () => {
this.webgl_supported = false;
- const item = this.menuItems.find((menu_item: any) => menu_item.key === "/map3d");
- if (item) {
- item.label = "3D地图(WebGL不可用)";
- item.disabled = true;
- }
this.flush();
};
window.addEventListener("ecap_cesium_webgl_unavailable", on_unavailable);
@@ -140,16 +130,25 @@ class App extends enhance.Base {
}
onClick: MenuProps['onClick'] = (e) => {
- if (e.key === "/map3d" && !this.webgl_supported) {
- message.warning(webgl_unavailable_message);
- this.navigate("/map");
- return;
- }
this.selected_key = e.key;
- this.navigate(this.selected_key); // 跳转到 /about 页面
+ this.navigate(this.selected_key);
this.flush();
};
+ switch_map = (map3d: boolean) => {
+ if (map3d && !this.webgl_supported) {
+ message.warning(webgl_unavailable_message);
+ return;
+ }
+ const prefix = this.location?.pathname.startsWith("/ui/") ? "/ui" : "";
+ this.navigate(`${prefix}/${map3d ? "map3d" : "map"}`);
+ };
+
+ render_map_switch(map3d: boolean) {
+ return ;
+ }
+
formatTimestamp(ts: number | string): string {
const n = Number(ts);
@@ -169,7 +168,10 @@ class App extends enhance.Base {
}
render() {
- const map2d =
;
+ const map2d =
+
+ {this.render_map_switch(false)}
+
;
const settings = ;
const aircraftList =
;
const dataTopology = 数据拓扑加载中...}>;
@@ -178,6 +180,7 @@ class App extends enhance.Base {
3D地图加载中...}>
+ {this.render_map_switch(true)}
: ;
return (
diff --git a/src/Map/Cesium_Map.tsx b/src/Map/Cesium_Map.tsx
index 9931a57..10eda00 100644
--- a/src/Map/Cesium_Map.tsx
+++ b/src/Map/Cesium_Map.tsx
@@ -1239,8 +1239,8 @@ export class Cesium_Map extends enhance.Base {
}
if (record.aircraft.model) {
const selected = this.is_selected_aircraft(this.entity_key(aircraft.data_source.key, aircraft.icao));
- record.aircraft.model.silhouetteColor = new Cesium.ConstantProperty(selected ? this.aircraft_contrast_color(aircraft) : color);
- record.aircraft.model.silhouetteSize = new Cesium.ConstantProperty(selected ? 6 : result ? result.obstructed ? 2 : 0 : 1);
+ record.aircraft.model.silhouetteColor = new Cesium.ConstantProperty(color);
+ record.aircraft.model.silhouetteSize = new Cesium.ConstantProperty(result ? result.obstructed ? 2 : 0 : 1);
}
const model = aircraft.data_model;
record.aircraft.description = new Cesium.ConstantProperty(`${this.aircraft_description(model)}
${this.aircraft_occlusion_description(aircraft, result)}`);
@@ -1350,7 +1350,7 @@ export class Cesium_Map extends enhance.Base {
record.aircraft.model.enableVerticalExaggeration = new Cesium.ConstantProperty(false);
record.aircraft.model.uri = new Cesium.ConstantProperty(this.aircraft_model_item(aircraft).url);
(record.aircraft.model as any).silhouetteColor = new Cesium.ConstantProperty(contrast_color);
- (record.aircraft.model as any).silhouetteSize = new Cesium.ConstantProperty(selected ? 6 : 0);
+ (record.aircraft.model as any).silhouetteSize = new Cesium.ConstantProperty(0);
}
if (record.aircraft.label) {
record.aircraft.label.show = new Cesium.ConstantProperty(this.aircraft_label_enabled(aircraft));
diff --git a/src/Map/WebGL_Support.ts b/src/Map/WebGL_Support.ts
index 71e6339..b9bd26b 100644
--- a/src/Map/WebGL_Support.ts
+++ b/src/Map/WebGL_Support.ts
@@ -9,7 +9,7 @@ type WebGL_Context_Options = {
};
const webgl_context_names: WebGL_Context_Name[] = ["webgl2", "webgl", "experimental-webgl"];
const cesium_webgl_unavailable_key = "ecap_cesium_webgl_unavailable";
-export const webgl_unavailable_message = "当前电脑无法初始化 WebGL，已切换到 2D 地图";
+export const webgl_unavailable_message = "当前电脑无法初始化 WebGL，无法使用 3D 地图";
function create_webgl_context(canvas: HTMLCanvasElement, name: WebGL_Context_Name, options?: WebGL_Context_Options): WebGLRenderingContext | WebGL2RenderingContext | null {
try {
return canvas.getContext(name, options as object) as WebGLRenderingContext | WebGL2RenderingContext | null;