Chart Image

📊 零浏览器依赖的专业图表引擎

dev-tool榜 #2

无浏览器依赖的轻量级图表生成工具,支持10+种图表类型,专为Fly.io/VPS部署优化,冷启动<500ms,适合数据可视化与监控告警场景。

收藏
28.1k
安装
9.7k
版本
2.2.0
CLS 安全性认证2026-05-20
点击查看完整报告 >

使用说明

核心用法

chart-image 是一个基于 Vega-Lite 和 Sharp 的纯 Node.js 图表生成引擎,通过命令行接口将 JSON 数据渲染为 PNG/SVG 图像。核心工作流为:定义数据 → 选择图表类型 → 配置视觉参数 → 输出图像文件。支持标准 CLI 参数(--type, --data, --output)及丰富的格式控制选项。

显著优点

部署友好性突出:无需 Chromium/Puppeteer(节省 400MB+ 依赖),无需原生编译(避开 node-canvas 的 build 依赖地狱),预构建 Sharp 二进制文件确保在容器环境即装即用。

性能优异:冷启动 <500ms,总依赖体积仅 ~15MB,特别适合 serverless 和边缘部署场景。

图表类型全面:涵盖折线、柱状、面积、散点、饼图/环形、K线、热力图等基础类型,同时支持多系列对比、堆叠条形、成交量叠加、迷你 sparkline 等进阶需求。

专业可视化能力:内置时间轴处理(--x-type temporal)、多种数值格式化(percent/dollar/compact/decimal4)、暗色主题、数据标注、水平参考线等企业级功能,输出质量可直接用于报告和告警。

离线可用:零外部 API 调用,对比 QuickChart.io 等 SaaS 方案无网络依赖和数据泄露风险。

潜在缺点与局限性

交互性缺失:仅生成静态图像,不支持工具提示、缩放、筛选等交互式探索功能。

定制深度受限:高级定制需手写 Vega-Lite JSON(--spec),对用户可视化专业知识有要求;主题系统仅支持明暗切换,无法细粒度调整配色。

数据规模上限:未明确标注大数据集性能边界,极端数据量(百万级点)可能受 Sharp 渲染内存限制。

生态耦合:依赖特定文件路径(/data/clawd/skills/chart-image/scripts/),跨平台迁移需调整部署配置。

适合人群

  • 需要为监控告警、数据报告、Telegram/Discord Bot 自动生成图表的后端开发者
  • 在 Fly.io、Docker、VPS 等资源受限环境运行的应用
  • 追求冷启动速度与依赖精简的 serverless/边缘计算场景
  • 对交互性无要求、重视离线可用性和渲染稳定性的数据团队

常规风险

路径注入风险--output 参数若未妥善过滤,可能导致任意文件覆盖(应限制输出目录为 /data/clawd/tmp/)。

数据解析风险--data 接收原始 JSON 字符串,恶意构造的 payload 可能触发原型链污染(需确保输入来源可信)。

资源消耗:高频调用场景下,Sharp 图像处理可能占用显著 CPU/内存,建议设置并发限制。

时区/本地化:暗色主题的时间自动切换基于以色列时区(20:00-07:00),多区域部署需注意调整。

安全解读

核心用法

chart-image 是一款专为无头服务器环境设计的图表生成工具,支持从 JSON 数据生成 PNG/SVG 格式的专业图表。通过命令行调用 chart.mjs 脚本,支持线形图、柱状图、面积图、饼图/环形图、K 线图、热力图等 8 种以上图表类型,以及多系列、堆叠、双 Y 轴等高级配置。

典型工作流:
1. 准备 JSON 数据数组(如 [{"x":"10:00","y":25}]

2. 指定图表类型、字段映射、视觉样式等参数

3. 生成图表文件并通过消息工具发送给用户

关键特性包括: --dark 暗黑模式、--show-change 变动标注、--focus-recent N 聚焦最近数据、--y-format 数值格式化(百分比/美元/紧凑数字)、时间轴自动识别、以及 sparkline 迷你图模式。

显著优点

  • 部署友好:纯 Node.js 实现,依赖 Sharp 预编译二进制,无需 Python/C++ 构建工具,规避了 node-canvas 常见的原生编译失败问题
  • 体积轻量:总依赖约 15MB,相比 Puppeteer 方案(400MB+)和浏览器内核方案,显著降低容器镜像大小和冷启动时间
  • 性能优秀:无浏览器启动开销,图表生成 <500ms,适合高频告警场景
  • 离线可用:零外部 API 依赖,数据不出本地,满足隔离网络环境需求
  • 格式丰富:内置 10+ 种图表类型和专业的金融/监控场景优化(K线、成交量叠加、变动标注)

潜在缺点与局限性

  • 静态输出:仅生成图片文件,无交互功能(悬停提示、缩放等),不适合 Web 端的动态探索需求
  • 数据规模受限:作为命令行工具,大数据量(数万点以上)可能触及内存和性能瓶颈
  • 样式定制天花板:基于 Vega-Lite 规范,极度复杂的自定义视觉需求可能需要直接编辑 spec 文件
  • 路径安全风险:输出路径目前未严格限制在当前工作目录内(已识别为低风险)
  • 无实时数据流:需外部脚本定时拉取和触发,本身不具备数据连接能力

适合人群

  • DevOps/SRE:需要为监控告警系统(如 Prometheus Alertmanager)附加趋势图表
  • 量化/金融开发者:快速生成 K 线图、价格走势叠加成交量图
  • 数据报告自动化:定时任务生成日报/周报图表,通过机器人推送到 Slack/Discord/微信
  • VPS/Fly.io 部署者:受限于资源配额,无法运行 Chromium 或重型可视化服务

常规风险

  • 文件系统写入:正常功能涉及向指定路径写入 PNG 文件,需确保 --output 参数不被用于目录遍历攻击(如 ../../../etc/cron.d/malicious
  • JSON 解析:依赖 JSON.parse() 处理用户输入,虽已有错误捕获,但极端大小的输入(>10MB)可能导致内存压力
  • 依赖维护:vega/vega-lite/sharp 为主流库但更新活跃,建议锁定版本避免破坏性更新

安全评估总结

该 Skill 通过 CLS-Certify 全面扫描,静态代码无危险函数、无硬编码密钥,动态行为仅限本地文件写入,网络流量为零,隐私合规通过 GDPR/CCPA 检查。综合评分 85/100,安全等级 S,来源可信度 T2(可信组织/GitHub 个人开发者)。

Chart Image 内容

scripts文件夹
手动下载zip · 29.7 kB
chart.mjstext/javascript
请选择文件