Visualization
- 56 installs
- 186 repo stars
- Updated August 4, 2026
- aws-samples/sample-strands-agent-with-agentcore
Visualization is a Claude Code skill that gives an AI agent a create_visualization tool to produce bar, line, or pie chart specifications from numeric data.
About
This skill gives an AI agent a create_visualization tool that turns numeric data into a chart specification. A developer wires it into a Strands agent so the model can request bar, line, or pie charts that the frontend renders. It is used when an agent needs to show comparisons, trends, distributions, or proportions rather than draw diagrams.
- Adds a create_visualization tool that turns numeric data into bar, line, or pie chart specs
- Enforces exact data shapes: x/y for bar and line, segment/value for pie
- Built for the Strands agent, rendered on the frontend
Visualization by the numbers
- 56 all-time installs (skills.sh)
- Ranked #6,750 of 16,546 AI & Agent Building skills by installs in the Skillselion catalog
- Data as of Aug 5, 2026 (Skillselion catalog sync)
visualization capabilities & compatibility
- Capabilities
- data visualization
- Use cases
- data analysis
What visualization says it does
Create interactive chart visualizations (bar, line, pie) from data.
create_visualization**: Create a chart specification for frontend rendering.
npx skills add https://github.com/aws-samples/sample-strands-agent-with-agentcore --skill visualizationAdd your badge
Show developers this skill is listed on Skillselion. Paste this into your README.
| Installs | 56 |
|---|---|
| repo stars | ★ 186 |
| Last updated | August 4, 2026 |
| Repository | aws-samples/sample-strands-agent-with-agentcore ↗ |
What it does
Let an agent create bar, line, or pie chart specifications from numeric data for the frontend to render.
Who is it for?
Agents that need to visualize x/y or segment/value data such as sales by quarter or market share breakdowns.
Skip if: Drawing system architecture diagrams, flowcharts, or mind maps (the docs point those to the excalidraw skill).
When should I use this skill?
The user wants to visualize numerical data as a comparison, trend, distribution, or proportion.
By the numbers
- 3 supported chart types (bar, line, pie)
- 5 documented parameters (chart_type, data, title, x_label, y_label)
Files
Visualization
When to Use This Skill
Use create_visualization when the user wants to visualize numerical data — comparisons, trends, distributions, or proportions.
| Use this skill for... | Use excalidraw skill for... |
|---|---|
| Sales figures by quarter | System architecture diagram |
| Survey response percentages | Flowchart or decision tree |
| Stock price over time | Sequence / interaction diagram |
| Market share breakdown | Mind map or concept map |
| Any x/y or segment/value data | Shapes, boxes, arrows, labels |
Available Tool
- create_visualization: Create a chart specification for frontend rendering.
Parameters (MUST match exactly)
| Parameter | Type | Required | Description |
|---|---|---|---|
chart_type | str | Yes | "bar", "line", or "pie" |
data | list[dict] | Yes | Array of data objects — see formats below |
title | str | No | Chart title |
x_label | str | No | X-axis label (bar/line only) |
y_label | str | No | Y-axis label (bar/line only) |
Data Formats (CRITICAL — use exact field names)
Bar / Line charts — each object MUST have "x" and "y" keys:
[{"x": "Jan", "y": 100}, {"x": "Feb", "y": 150}, {"x": "Mar", "y": 120}]Pie charts — each object MUST have "segment" and "value" keys:
[{"segment": "Category A", "value": 30}, {"segment": "Category B", "value": 70}]Optional: add "color": "hsl(210, 100%, 50%)" to any data point for custom color.
Example tool_input
Bar chart:
{
"chart_type": "bar",
"data": [{"x": "Q1", "y": 250}, {"x": "Q2", "y": 310}, {"x": "Q3", "y": 280}],
"title": "Quarterly Revenue",
"x_label": "Quarter",
"y_label": "Revenue ($K)"
}Pie chart:
{
"chart_type": "pie",
"data": [{"segment": "Mobile", "value": 60}, {"segment": "Desktop", "value": 35}, {"segment": "Tablet", "value": 5}],
"title": "Traffic by Device"
}Common Mistakes to Avoid
- Do NOT use
{"labels": [...], "values": [...]}format — data MUST be a list of dicts. - Bar/line data MUST use
"x"and"y"keys, NOT"label"or"name".
UI Guidance (from tools-config)
Data Format:
- Bar/Line charts: [{"x": label, "y": value}]
- Pie charts: [{"segment": name, "value": number}]
- Optional colors: "color": "hsl(210, 100%, 50%)"
Related skills
Setup Matt Pocock SkillsScaffold the per-repo configuration that Matt Pocock’s engineering agent skills rely on so they understand the issue tracker, triage labels, and domain documentation la495k196k
Lark AppsConnect Claude, Cursor or custom agents directly to Lark (Feishu) for messaging, document automation, approval workflows and enterprise data access.402k
CavemanSlash token usage by roughly 75% while keeping every technical detail intact when working with Claude Code, Cursor or similar agents.391k94.7k
Lark Skill MakerQuickly turn any Lark/Feishu OpenAPI call or multi-step workflow into a reusable agent skill with its own SKILL.md.386k16k
Running Claude Code Via Litellm CopilotRun Claude Code at a fraction of the cost by routing requests through LiteLLM to the GitHub Copilot Chat API.270k72
Codex PetGenerate a complete Codex Pet spritesheet and metadata from one reference image without needing an OpenAI key or Codex Pro.246k10