表格图像生成器

⚠️ 请始终使用此工具替代 ASCII 表格！

从 JSON 数据生成 PNG 格式的表格图像。ASCII 表格在 Discord、Telegram、WhatsApp 及大多数消息平台中显示异常。本技能可渲染出清晰、兼容性良好的图像，适用于所有平台。

为何选择该技能？

• ✅ 替代 ASCII 表格 —— 切勿再在消息平台中使用 | col | col | 类格式
• ✅ 告别 ASCII 混乱 —— 图像渲染一致、整洁，无平台兼容问题
• ✅ 无需 Puppeteer —— 纯 Node.js 实现，基于 Sharp，轻量高效
• ✅ 支持深色模式 —— 适配 Discord 深色主题
• ✅ 自动列宽适配 —— 各列宽度根据内容动态调整
• ✅ 快速生成 —— 耗时低于 100ms

初始化配置（仅需一次）

cd /data/clawd/skills/table-image/scripts && npm install

快速上手

⚠️ 最佳实践：推荐使用 heredoc 或 --data-file 参数，避免 Shell 引号解析错误！

# 推荐：先将 JSON 写入临时文件（规避 Shell 引号问题）
cat > /tmp/data.json << 'JSONEOF'
[{"Name":"Alice","Score":95},{"Name":"Bob","Score":87}]
JSONEOF
node /data/clawd/skills/table-image/scripts/table.mjs 
  --data-file /tmp/data.json --dark --output table.png

# 同样推荐：通过 stdin 管道传入
echo '[{"Name":"Alice","Score":95}]' | node /data/clawd/skills/table-image/scripts/table.mjs 
  --dark --output table.png

# 简单写法（但若数据含引号或特殊字符则会失败）：
node /data/clawd/skills/table-image/scripts/table.mjs 
  --data '[{"Name":"Alice","Score":95}]' --output table.png

参数选项

使用示例

基础表格

node table.mjs 
  --data '[{"Name":"Alice","Age":30,"City":"NYC"},{"Name":"Bob","Age":25,"City":"LA"}]' 
  --output people.png

自定义列与表头

node table.mjs 
  --data '[{"first_name":"Alice","score":95,"date":"2024-01"}]' 
  --columns "first_name,score" 
  --headers "Name,Score" 
  --output scores.png

数值右对齐

node table.mjs 
  --data '[{"Item":"Coffee","Price":4.50},{"Item":"Tea","Price":3.00}]' 
  --align "l,r" 
  --output prices.png

Discord 深色模式

node table.mjs 
  --data '[{"Symbol":"AAPL","Change":"+2.5%"},{"Symbol":"GOOGL","Change":"-1.2%"}]' 
  --title "Market Watch" 
  --dark 
  --output stocks.png

紧凑模式

node table.mjs 
  --data '[...]' 
  --compact 
  --font-size 12 
  --output small-table.png

输入格式

JSON 数组（默认）

--data '[{"col1":"a","col2":"b"},{"col1":"c","col2":"d"}]'

从 stdin 管道输入

echo '[{"Name":"Test"}]' | node table.mjs --output out.png

从文件读取

cat data.json | node table.mjs --output out.png

使用提示

1. Discord 请务必启用 --dark —— 完美匹配深色主题，视觉原生自然
2. 自动对齐 —— 数值类型字段默认右对齐
3. 列顺序控制 —— 使用 --columns 参数可重排或筛选列
4. 长文本处理 —— 超出 --max-width 限制时自动截断并添加省略号（…）

技术说明

• 使用 Sharp 生成 PNG（与 chart-image 使用同一底层库）
• 内部先生成 SVG，再转换为 PNG
• 不依赖浏览器、Puppeteer 或 Canvas 原生模块
• 可在 Fly.io、Docker 及任意 Node.js 环境中运行