为电商运营场景设计的一款实时数据可视化大屏,用于展示 GMV、订单数、活跃用户、转化率等核心经营指标。大屏包含四个核心指标卡、销售额 24 小时趋势折线图、品类销售占比饼图、热销商品 TOP8 柱状图、全国订单分布地图以及实时订单滚动流。所有数据采用定时刷新机制模拟实时变化,地图支持鼠标拖拽和缩放。整体采用深色科技感风格,适合企业在会议室、展厅、数据中心等场所展示业务运行态势。
大屏采用纯前端架构,HTML5 构建页面,CSS3 Grid 完成多区域大屏布局,ECharts 5 负责所有图表渲染。指标卡通过 setInterval 定时刷新模拟实时数据;折线图使用 areaStyle 渐变填充增强科技感;饼图做成环形图并配合图例展示;柱状图使用横向渐变条形;中国地图通过 ECharts 内置的 china.js 实现省份数据可视化与颜色映射。实时订单流采用 CSS 动画实现无缝循环滚动。项目无后端依赖,部署简单,可快速迁移为真实数据接口版本。整体响应式适配,能满足大屏、PC 等不同展示环境