chart-image

Generate chart images from JSON data using Vega-Lite and Sharp.

1|Updated Jun 6, 2026
One-click install
npx skills add https://github.com/phillipgan/myagent --skill chart-image-phillipgan
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: chart-image
Source: https://github.com/phillipgan/myagent/tree/main/skills/chart-image
Command: npx skills add https://github.com/phillipgan/myagent --skill chart-image-phillipgan

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires vega, vega-lite, sharp, and includes scripts (resource) and assets (resource) components.

What problem does it solve?

This Skill generates publication-quality chart images directly from JSON data, eliminating the need for complex software installations and browser dependencies.

Core Features & Use Cases

  • Chart Generation: Supports various chart types including line, bar, area, point, histogram, candlestick, pie/donut, heatmap, multi-series, and stacked charts.
  • Data Visualization: Ideal for visualizing data, creating graphs, plotting time series, showing distributions, or generating chart images for reports/alerts.
  • Use Case: Suppose you have sales data for the past month. Use this Skill to generate a line chart showing daily sales trends.

Quick Start

Use the chart-image skill to create a line chart from the provided data. Example command: node scripts/chart.mjs --type line --data '[{"x":"Mon","y":10},{"x":"Tue","y":25},{"x":"Wed","y":18}]' --title "Weekly Sales" --output chart.png

Frequently Asked Questions about chart-image

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate chart images from JSON data in a Node.js server environment?

You generate chart images by passing JSON data to this Skill, which uses Vega-Lite to render SVG charts and Sharp to convert them to PNG, eliminating browser dependencies in headless Node.js server environments.

What types of data visualization charts can I create for dashboard reports?

You can create multiple data visualization chart types for dashboards, including line, bar, area, point, histogram, candlestick, pie/donut, heatmap, multi-series, and stacked charts from JSON data.

Can I use Vega-Lite to automate report generation without installing complex software?

Yes, you can use Vega-Lite to automate report generation without complex software installations by leveraging this Skill to produce publication-quality chart images directly from JSON data.

Does this chart generation approach work for plotting time series in performance monitoring bots?

Yes, this chart generation approach works for performance monitoring bots by plotting time series data from JSON into static PNG images, enabling automated alerts and dashboard updates.

What's the best way to plot daily sales trends from JSON data into a PNG file?

The best way to plot daily sales trends from JSON data into a PNG file is using this Skill's script, passing JSON arrays and chart type arguments to render publication-quality visual outputs.

Do I need a browser to render SVG charts and convert them to PNG?

No, you do not need a browser to render SVG charts and convert them to PNG; this Skill operates in headless server environments using Node.js, Vega-Lite, and Sharp for image conversion.