求职方向:前端研发、全栈开发、AI Agent

个人项目工作项目

DATA VISUALIZATION DELIVERY

32:9 实时数据大屏

该项目由本人独立完成前端开发,面向 7680 × 2160 双宽屏展示监测指标、排行、趋势和节点分布。首版读取本地数据,可直接部署为静态页面;公开 Demo 使用合成数据重建主要交互。

打开 Demo
时间
2020–2021 · 独立兼职项目
职责
前端架构 · 页面开发 · 图表 · 动效 · 部署版本
状态
原项目为前端交付 · 公开 Demo 为离线合成重建
范围
监测指标、排行、趋势与节点分布 / ECharts / SVG 图形和全局缩放
  • React 16
  • ECharts 4
  • React Motion
  • SVG
  • Less

OUTCOMES

项目结果

  • 以 3840 × 1080 逻辑画布统一适配 7680 × 2160 双宽屏和普通开发窗口。
  • 七个初始屏幕共享卡片、表格、标签和图表组件,样本数据与图表配置按场景隔离。
  • 交付可独立运行的纯前端版本;后续继续增加场景、修正视觉并适配字段。

INTERACTIVE EVIDENCE

交互 Demo

SOURCE-VERIFIED OFFLINE RECONSTRUCTION

Distributed Network Observatory

OFFLINE

可切换总览、节点地图、网络画像和协作流,并操作筛选、时间范围、节点详情与自动巡演。演示使用合成数据,不请求接口。

全窗口体验
01

超宽屏适配

已实现

应用以 3840 × 1080 逻辑画布计算全局比例,并同步缩放字号、布局、ECharts 与 SVG,在目标双宽屏和普通开发窗口中保持一致。

02

图表与数据

已实现

七个初始屏幕共享卡片、表格、标签和图表组件;各场景的样本数据和图表配置分别位于独立模块,页面负责组合与状态切换。

03

联动与动效

已实现

地图筛选会同步更新节点、图例、趋势和明细;数字、排行、路径与表格滚动使用统一的低干扰动画节奏。

04

交付范围

公开演示

首版交付为可独立运行的纯前端版本。后续继续负责新增页面、视觉修正和字段适配;公开版本已移除品牌、接口与真实数据。

本页目录
  1. 超宽屏适配
  2. 图表与数据
  3. 联动与动效
  4. 交付范围
← 返回个人项目集