Skip to content

feat: 搭建全球草地智能监测管理系统 SPA 雏形#1

Open
soliloquyang wants to merge 1 commit intomasterfrom
codex/design-project-directory-structure
Open

feat: 搭建全球草地智能监测管理系统 SPA 雏形#1
soliloquyang wants to merge 1 commit intomasterfrom
codex/design-project-directory-structure

Conversation

@soliloquyang
Copy link
Owner

Motivation

  • 搭建一个基于现代前端栈的单页应用原型,支持全球草地监测的可视化与时序分析,并预留与 GEE 的后续接入能力。

Description

  • 使用 React + TypeScript + Vite + Tailwind 初始化项目骨架并添加构建配置与样式入口文件。
  • 新增 Dashboard 组件结构与实现:HeaderBar(顶部导航与时间选择)、LayerManagementPanel(左侧图层树与透明度控制)、GlobalMap(MapLibre + Deck.gl 图层渲染、ROI 绘制、Hover Tooltip)、AnalyticsPanel(右侧 ECharts 时序图)、TimelineSlider(底部时间滑块)。
  • 实现数据与服务占位:src/data/mockData.ts 提供全局网格 GeoJSON 与时序 Mock 数据与时间动态函数,src/services/geeService.ts 提供 GEE 接口适配层的 Mock 实现。
  • 将地图逻辑模块化:在 src/components/GlobalMap.tsx 中实现多图层叠加(草地类型、NDVI、降水、瓦片影像)、Deck.gl 的颜色映射与混合(blendOperation: 'add')、以及点击绘制 ROI 功能与 tooltip 像元统计。

Testing

  • 执行 npm install 以安装依赖时失败(环境向 npm registry 请求 @deck.gl/* 返回 403),因此依赖未能安装并且未能在容器中完整构建或启动前端服务(失败)。
  • 尝试通过 Playwright 打开 http://127.0.0.1:4173 并截图的自动化流程返回 ERR_EMPTY_RESPONSE,原因是前端服务未启动(失败)。
  • 未能运行 vite 预览或 npm run build 验证 UI 运行时行为,因此所有 UI/交互功能基于 Mock 数据在代码级实现但未在浏览器中完成端到端自动验证(未执行)。

Codex Task

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

1 participant