【报表和BI大屏】ECharts数据可视化大屏 / 驾驶舱

Apache ECharts

Apache ECharts 是前端 JS 开源可视化图表库(Apache2.0 协议,免费商用),底层基于 ZRender 渲染引擎,专门用来在网页绘制各类图表、大屏可视化 ,**不是完整 BI 平台,只是图表渲染原材料,**前身百度 ECharts,现在归属 Apache 基金会。

架构

复制代码
业务数据(后端接口返回JSON)
    ↓
ECharts实例,接收 option 配置(声明式)
    ↓
ZRender 渲染引擎(底层绘图内核)
    ↓
Canvas / SVG 二选一渲染到div容器
  • ZRender:ECharts 底层 2D 绘图引擎,负责图形绘制、事件拾取、动画、图层管理Apache ECh...
  • 渲染模式:
    • Canvas:大屏、大数据量优先,性能更好;
    • SVG:矢量,放大不失真,适合移动端、小图表、导出图片。
  • 编程模型:声明式 Option ,配置对象包含:title、tooltip、legend、xAxis、yAxis、series、grid,修改 option 即可更新图表,不用操作 DOM。

内置图表类型

基础图表:柱状、折线、饼图、环形、K 线、散点、雷达、仪表盘 Gauge

高级:地图、热力图、漏斗图、树图、旭日图、关系图、平行坐标、自定义图形custom

扩展:ECharts GL(3D 地图 / 3D 柱状图)

组件(辅助元素):提示框 tooltip、图例 legend、数据缩放 dataZoom、标线 markLine、markPoint、brush 刷选、工具箱 toolbox。

商业化产品

永洪 BI,自研

Apache Superset开源,React+ECharts,私有化大数据探索,大屏能力偏弱

AJ-Report / 积木报表,开源,底层封装 ECharts,拖拽大屏,自动生成 ECharts 配置,后端管理数据集,低代码平台常用,大屏 + 报表一体

百度 SugarBI、阿里 QuickBI

帆软体系里:私有化或Saas部署

**FineReport 做决策报表(大屏),**自研封装 ECharts,

**FineBI 自助分析,也支持大屏驾驶舱,**自研封装 ECharts

和简道云表单 / 流程引擎是独立模块。

帆软大屏不是 ECharts 手写页面,是自研可视化引擎

  1. FineReport:决策报表(决策大屏) ,绝对布局,拖拽组件(KPI、柱状图、折线、地图、表格),写数据集 SQL,配置自动刷新。
    • 数据集:JDBC 直连 MySQL/Oracle、API、存储过程、Excel
    • 保存:大屏布局 JSON + 数据集定义,存帆软内置库
    • 渲染:帆软自研前端渲染引擎,底层封装 ECharts
  2. FineBI:仪表板 / 驾驶舱,自助拖拽,适合业务人员自己做分析看板,也可以发布为大屏全屏模式。
相关推荐
用户921080262861 小时前
为什么 Header 是 HTTP 的灵魂
前端
特立独行的猫A1 小时前
AtomMQTT Broker — 用 Rust 实现的轻量级高性能 MQTT 消息代理
前端·后端·架构
BYSJMG1 小时前
计算机毕业设计选题推荐:基于大数据的水质多指标关联分析与可视化的设计与实现,Spark 加 K-Means 做水质分群
大数据·hadoop·信息可视化·数据分析·spark·kmeans·课程设计
IMPYLH1 小时前
HTML 的 <s> 元素
前端·html
lhldsg1 小时前
折扣卡CPS小程序定制全流程实战指南:从需求分析到上线部署
java·前端·小程序
计算机魔术师1 小时前
Lambert 算了一笔账:CUDA 绑定开源生态,每年值 100 亿美元
前端
龙亘川1 小时前
数字化建设案例|构建议案履职一体化闭环,解决议案建议办理多主体协同难题
大数据·人工智能·科技·信息可视化·智慧城市
晴天161 小时前
HTML iframe 标签全面解析:原理、属性、实战场景与最佳实践
前端·html·状态模式
parade岁月1 小时前
倒反天罡!押注 React Native 6 年后,Shopify 又回到了原生开发
android·前端·ios