当前位置:
AIGC文章详情

AI画图表,为什么大多最后都是ECharts?3条路子对比,坑也说清了

源自165位全网作者

14:56

不知道你有没有注意到一个现象:AI生成的调研报告里、让大模型写的前端demo里、甚至在线文档工具里,一到"画图表"环节,输出的十有八九是 ECharts 代码。

这不是巧合。背后有三个很现实的原因:

第一,ECharts 天生"适合 AI 写"。 它是声明式的 JSON 配置(option)——你只需要描述"画什么图、数据是什么",不用一串 API 调用。大模型生成这种结构化配置最稳,错了也容易看出来。

第二,语料足够多。 ECharts 是中文互联网最流行的图表库之一,GitHub 超过 6.6 万 star。知乎 B 站上一门 ECharts 大屏课就有 160 多万播放、6.8 万人收藏。哔哩哔哩 模型见过的样本足够多,生成才靠谱。

第三,用起来没有顾虑。 Apache 2.0 开源协议,商用免费,官方包在 Apache 基金会治理下,企业项目里也敢放。

所以"让 AI 帮你画 ECharts"是一条可以直接抄的路线。现在主要有三条走法:

路径一:直接问通用大模型,拿到代码就用。 适合一次性图表、汇报演示。把需求和数据贴过去,让它输出完整的 HTML + ECharts 代码,浏览器打开就能看。去年就有 UP 主专门做了"DeepSeek + ECharts 快速生成图表"的教程,6 万播放。哔哩哔哩 今年 7 月还有网友晒出 AI 生成的调研报告,8 章内容里带 7 张 echarts 图表。微博 优点是零门槛,缺点是数据是死的。

AI画图表,为什么大多最后都是ECharts?3条路子对比,坑也说清了

路径二:AI 编程工具 + 真实数据,接进生产。 适合图表要进报表、大屏、管理系统的场景。今年 6 月知乎上一篇企业实践很有代表性:做股票 K 线图,内置图表搞不定,手写配置太慢。他们的流程就三步——从报表导出数据参数,粘给 AI 编程工具提需求(“生成 K 线图,标注最高最低价,加缩放滚动”),AI 出完整脚本,再回填模板。知乎 原本翻半天文档的活,压缩成一次对话。但有个大坑:AI 生成的是具体数值,回填动态系统时要改回参数引用(比如 `${tradeDate}`),否则图表永远是死的。

AI画图表,为什么大多最后都是ECharts?3条路子对比,坑也说清了

路径三:MCP 工具接入。 适合想把"画图"变成 AI 工作流固定能力的人。MCPECharts 这类开源项目已经能基于 MCP 协议让 AI 动态生成 ECharts 图表。微博 方向还早,值得盯。

四个坑,提前说:

  1. 版本漂移。 ECharts 6.0 去年 8 月就发布了。微博 官方一口气做了 12 项升级:全新默认主题、深色模式、和弦图、蜂群图、断轴、矩阵坐标系。Apache ECharts 官网 但 AI 的训练语料很多还是 5.x 时代的,生成的风格、写法可能跟你项目里的版本对不上,效果不对先查版本。

  2. 地图图。 ECharts 5 开始,地图地理数据不随包发布了,AI 给你的通常只是配置代码,GeoJSON 得自己找、自己注册。

  3. AI 让你装的第三方包,别盲装。 今年 5 月 npm 爆发"沙虫"投毒事件,323 个包、639 个恶意版本,影响最大的单一包就是 React 封装库 echarts-for-react(周下载量约 110 万)。微博 官方 echarts 主包不在通报名单里,但第三方封装不一定干净——AI 建议你"装个包更方便"时,先查查版本底细。

  4. 复杂图别全信。 桑基图、关系图这类,AI 能给 80 分版本,最后 20 分(标签重叠、极端数据)还得自己对着文档调。知乎

对不同人: 偶尔做图,路径一就够;经常做报表大屏,把路径二的流程搭起来;做 AI 工具的,盯 MCP 方向。值得继续观察的信号:6.0 的新图表类型(小提琴图、范围柱状图)和新默认主题进入语料后,AI 生成质量还会涨一波。

AI画图表,为什么大多最后都是ECharts?3条路子对比,坑也说清了

AI画图表,为什么大多最后都是ECharts?3条路子对比,坑也说清了

内容由AI生成

精选参考来源

1. ECharts 8 个实战技巧,从配置到性能全覆盖

2. ECharts数据可视化项目-大屏数据可视化展示-echarts图表制作-pink老师直播课更新完毕)

3. Deepseek+ECharts快速生成图表,真的太厉害了!

4. 我的 k3周用量已经没了,大概就用了两天多一点点 我查了使用明细,主要的“罪魁祸首”是一个跑了大概5~7小时左右的调研报告该报告含8章、7个 echarts 图表、4个手工 SVG/结构图,用6个 agent 约200次检索交叉验证生成感觉也不是太复杂,但大概消耗了25%~30%之间的月度用量… 费用折算估计得50块 RMB 了,真心不便宜如果用 API 肯定更夸张冲了一点额度加油包,试试耐不耐烧,主要是 app 到了收尾的时候了,干等着不是办法,用其他模型处理,我担心功亏一篑我把邀请有奖贴下面了 看看能不能蹭点福利

5. 用 AI 编程生成 ECharts 图表并嵌入润乾报表的实践

6. 在线数据可视化通常需要手动编写复杂配置,生成图表流程繁琐且不易自动化。MCPECharts是一个基于AIMCP技术的开源项目,能动态生成ApacheECharts图表,极大简化图表制作和数据分析的过程。它不仅支持ECharts的全部特性和语法,还能导出PNG、SVG以及图表配置,支持本地全流程生成,安全...全文

7. Apache ECharts 6.0 正式发布网页链接

8. ECharts 6 特性介绍

9. 安全风险快讯Shai-Hulud npm包投毒高危漏洞网页链接一、漏洞详情2026年5月19日攻击者利用被攻陷的npm维护者账户atool,在短时间内批量发布了大量恶意软件包版本,涉及323个独立程序包的639个恶意版本,受影响最严重的是@antv(数据可视化开源品牌)系列包。一旦开发者主机或CI环境安装了受影响版本,恶意代码便会扫描本地文件、环境变量和现有登录态,重点窃取GitHub Token、npm Token、AWS/GCP/Azure凭据、Vault Token、SSH私钥、Docker认证信息、数据库连接串,以及 Slack、Stripe、Twilio 等第三方服务密钥。若GitHub Token同时具备 `repo`、`workflow` 等高权限,攻击者还可进一步创建新的GitHub仓库作为数据回传通道,把单机入侵继续放大为组织级供应链风险。涉及版本:2026年5月19日发布的`@antv` 生态及其关联的上百个npm组件。二、影响版本echarts-for-react:一个React封装的图表库,周下载量约110万次,是本次攻击中影响最大的包。@antv 系列核心库:@antv/g2, @antv/g6, @antv/x6, @antv/l7, @antv/s2, @antv/f2, @antv/g, @antv/g2plot, @antv/graphin, @antv/data-set 等。其他社区包:timeago.js, size-sensor, canvas-nest.js 等。三、处理方式1、 安全排查请通过以下方式进行排查:(1)检查项目依赖:审查项目根目录和node_modules下所有package.json文件,排查是否存在被篡改的preinstall脚本。(2)排查锁文件与近期安装记录,重点核对2026-05-19当天是否引入了@antv/g2、@antv/x6、@antv/x6-geometry、echarts-for-react、timeago.js、size-sensor、canvas-nest.js 的可疑版本。(3)检查GitHub账户活动:检查组织或个人GitHub账户下,是否出现了来源不明、命名模式可疑的新仓库。2、处置方案(1)隔离环境:立即断开受影响机器或容器的网络连接。(2)凭证轮换:立即轮换所有可能暴露的密钥和Token。这包括但不限于npm Token、GitHub Personal Access Token、所有云服务商(AWS等)的Access Key、数据库密码、CI/CD平台密钥等。(3)代码回滚:将受影响的依赖回滚至确认安全的版本,或暂时使用官方提供的安全替代品。(4)彻底清理:删除整个node_modules目录和package-lock.json文件后重新安装依赖。建议在受控环境中进行,防止二次感染。 专栏 · 互联网/IT

0
扫一下,分享更方便,购买更轻松
0评论

当前文章无评论,是时候发表评论了
提示信息

取消
确认
评论举报

最新文章 热门文章