性能优化:Cesium 懒加载+后台预载、按需渲染、射线检测节流、城市标签 primitive 化、时间轴纹理跟随可视区域
- Cesium 改为动态加载(vite 插件不再注入 6MB 脚本),首屏零 Cesium 请求 - 首帧渲染后后台预载地理视图,loading 展示 8 秒期间并行,就绪前地理按钮置灰 - Three.js 按需渲染:静止停止重绘,动画/交互/状态变化时渲染 - 射线检测合帧节流,binder 只测当前页±1、时间轴只测可视窗口 - 移除 vignette 的 mix-blend-mode 全屏合成 - 7342 个城市从 entity 改为 PointPrimitiveCollection + LabelCollection - 时间轴懒加载窗口跟随可视区域(拖拽/缩放实时跟随)
This commit is contained in:
@@ -124,13 +124,20 @@ export class CesiumGlobe {
|
||||
this._visible = false;
|
||||
this._pendingData = 2; // 国家边界 + 城市数据
|
||||
this.ready = new Promise((resolve) => { this._resolveReady = resolve; });
|
||||
this.viewerReady = new Promise((resolve) => { this._resolveViewerReady = resolve; });
|
||||
}
|
||||
|
||||
async ensureCreated() {
|
||||
if (this._created) return;
|
||||
this._created = true;
|
||||
|
||||
await loadCesium();
|
||||
try {
|
||||
await loadCesium();
|
||||
} catch (err) {
|
||||
this._created = false; // 失败可重试
|
||||
console.warn('[CesiumGlobe] Cesium 脚本加载失败:', err);
|
||||
return;
|
||||
}
|
||||
|
||||
// 调整实体渲染顺序:先渲染标签(城市/国家名),再渲染 Billboard(标记便签),
|
||||
// 让词条标记始终显示在城市/国家名的上层。
|
||||
@@ -255,6 +262,12 @@ export class CesiumGlobe {
|
||||
this.setVisible(this._visible);
|
||||
this.resize();
|
||||
this.flyToEntry(this.selected);
|
||||
|
||||
// 地球已就绪(影像/地形/城市数据继续后台加载),通知 App 隐藏加载遮罩
|
||||
if (this._resolveViewerReady) {
|
||||
this._resolveViewerReady();
|
||||
this._resolveViewerReady = null;
|
||||
}
|
||||
}
|
||||
|
||||
_buildMarkers() {
|
||||
|
||||
Reference in New Issue
Block a user