graphic-chart

Generate publication-quality PNG charts using Chart.js v4 and Apache ECharts v6.

581|60|Updated Apr 13, 2026
One-click install
npx skills add https://github.com/Varnan-Tech/opendirectory --skill graphic-chart
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: graphic-chart
Source: https://github.com/Varnan-Tech/opendirectory/tree/main/skills/graphic-chart
Command: npx skills add https://github.com/Varnan-Tech/opendirectory --skill graphic-chart

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires chart.js, echarts, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill allows you to generate high-quality data visualization charts in various types (bar, line, area, pie, doughnut, scatter, radar, treemap) directly as PNG images using Chart.js and Apache ECharts.

Core Features & Use Cases

  • Multiple Chart Types: Generate different types of charts including bar, line, area, pie, doughnut, scatter, radar, and treemap.
  • Customization: Customize the chart style, dimensions, annotations, and data presentation.
  • Use Case: You can create a detailed line chart to visualize sales trends over time, or a pie chart to show market share distribution.

Quick Start

To create a bar chart with the title 'Monthly Sales' and data [100, 200, 150, 300, 250], use the command: 'create a bar chart. Title: Monthly Sales. Data: [100, 200, 150, 300, 250].'

Frequently Asked Questions about graphic-chart

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

FAQPage Schema
How do I generate data visualization charts as PNG images for business reports?▼

To generate data visualization charts as PNG images for business reports, you can use Chart.js v4 and Apache ECharts v6 to create publication-quality visualizations directly from your raw data inputs.

What chart types can I create using Chart.js and ECharts?▼

Using Chart.js and ECharts, you can create multiple chart types including bar, line, area, pie, doughnut, scatter, radar, and treemap charts for various data presentation needs.

Can I customize the styling and dimensions of generated charts?▼

Yes, you can customize chart style, dimensions, annotations, and data presentation to meet specific formatting requirements for your presentations and analysis.

Do I need to format my data before creating a chart?▼

Yes, you need to provide properly formatted data and specify chart types, as generating publication-quality visualizations requires knowledge of data formatting and styling options.

What is the best way to visualize sales trends over time?▼

The best way to visualize sales trends over time is by generating a detailed line chart using Apache ECharts or Chart.js, outputting a publication-quality PNG image for your reports.