Skip to content
Back to skills

Visualise Chart

ASecurity

Use when the user asks to visualise data as a chart. Returns a self-contained HTML chart fragment using inline SVG or Canvas in a visualizer fence. Don''t use for tasks that require source or remote-system changes.

  • 52 stars
  • 0 votes
  • 0 copies
  • 3 views
  • Added September 3, 2026
ai-agentsrust

Works with

  • cli

Security analysis

A100/100

Pro scans all 2 files and shows the line behind each finding

Scanned September 3, 2026

npx -y skills add OutlineDriven/outline-driven-development --skill visualise-chart --agent claude-code

Installs into .claude/skills of the current project.

Are you the author of Visualise Chart?

Add the live security badge to your README. It updates with every re-scan.

Security grade badge for Visualise Chart
[![Security: A — Skills Directory](https://www.skillsdirectory.com/api/skills/outlinedriven-visualise-chart-outline-driven-development/badge)](https://www.skillsdirectory.com/skills/outlinedriven-visualise-chart-outline-driven-development)

More formats (shields.io, HTML) on the badges page. Keep it an A: scan every change in CI with Pro.

Download with Pro
SKILL.md
---
name: visualise-chart
description: 'Use when the user asks to visualise data as a chart. Returns a self-contained HTML chart fragment using inline SVG or Canvas in a visualizer fence. Don''t use for tasks that require source or remote-system changes.'
---

# Visualise chart

## Contract

| Field | Bound contract |
|---|---|
| Trigger | User asks to chart, plot, graph, or visualise numeric or series data. |
| Authority | Read-only: no file, VCS, credential, paid, published, deployed, or remote mutation. |
| Side effect | Chat output only: a visualizer fence containing an HTML fragment with an inline SVG or Canvas chart. |
| Done | A valid chart is present in the visualizer fence. |

## Inputs

- Required: data (values, series, or raw numeric data the user provides) and chart type (bar, line, doughnut, scatter, sparkline, or other named chart format the user requests).
- Optional: title, axis labels, legend preference, color palette guidance, width/height constraints.

## Procedure

1. Parse and validate the user-provided data and chart type. Validate data format at the trust boundary. Done when: data parses as valid numeric or series data, or the step has stopped with `INVALID_DATA`.
2. Select an inline SVG or Canvas renderer, whichever best fits the chart type and data shape. Do not reference external scripts, CDNs, or libraries. All rendering logic is inline. Done when: a rendering approach is selected, or the step has stopped with `UNSUPPORTED_TYPE`.
3. Generate a self-contained HTML fragment containing only the inline renderer and the chart markup. Embed all data, labels, and configuration inline. Do not fetch external data. Do not use `<iframe>`, `<object>`, or `<embed>`. Do not reference external scripts, stylesheets, or fonts. Done when: the fragment contains only inline data and inline rendering logic with no external references.
4. Wrap the fragment in the visualizer fence marker so the client renders it in a sandboxed iframe. Done when: the fragment is wrapped in the visualizer fence.
5. Return the fenced fragment as the sole output. Do not write files, mutate repositories, or call external services. Done when: the fenced fragment is the only output in the response.

## Failure and recovery

- `INVALID_DATA`: malformed numeric or series data. Return the named failure class and stop. Do not produce a chart fragment from invalid input.
- `UNSUPPORTED_TYPE`: chart type not recognized. Return the named failure class and stop. Do not invent a fallback chart type.
- `NON_CONVERGED`: rendering cannot be completed. Return `NON_CONVERGED` with the named failure class. Do not pretend the done predicate holds.

No mutation occurs; the only output is the visualizer fence or a named failure class.

## Output

A visualizer fence containing a self-contained HTML fragment with an inline SVG or Canvas chart. No external scripts, CDNs, stylesheets, fonts, or iframe elements.

Files in this skill

  • SKILL.md2.9 KB
  • agents/openai.yaml121 B

Attribution

Is this your skill, or is something wrong with this listing? Request removal or report an issue. Author removals are honored within 72 hours.

Comments

Loading comments…