01
大屏组件化重构
问题
传统大屏经常是一次性页面，迭代一多就变成维护灾难。
方案
围绕布局、图表、地图和动画拆分成独立组件与通用脚本，并建立统一发布方式。
结果
组件复用率提升 60%，后续需求交付更快。
返回项目列表
大屏可视化
数据大屏可视化平台
参与能源电力与视联平台方向的大屏重构，主导可视化基础能力建设。
技术栈
Vue 3EChartsWebSocket地图渲染磁贴布局3D
素材与示意
没有完整截图的项目，会先用结构化占位保证阅读不断档。
diagram
地图与撒点占位
首版用架构化描述代替真实项目截图，后续可补视觉素材。
背景
问题背景
大屏项目常见问题是页面耦合严重、复用差、分辨率适配困难，且实时数据与视觉效果都很重。
主导前端架构设计与基础框架搭建
设计磁贴布局系统与 ECharts 地图渲染引擎
实现撒点动画、实时数据刷新和适配策略
推动组件化拆分与团队复用沉淀
拆解
关键技术拆解
下面按问题、方案和结果来写，方便直接看我在项目里做了什么。
02
实时地图与动画引擎
问题
地图、撒点和实时数据更新容易互相干扰，导致卡顿和代码混乱。
方案
将地图渲染、图层更新和动画效果拆成有边界的模块，并控制刷新节奏。
结果
既保证展示效果，也降低了后续维护和扩展的难度。