Data & Analysis

Canvas Chart Rendering Skill (ECharts)

Enables AI to output DOJO_CHART blocks that render interactive ECharts visualizations on the Dashboard Canvas.

59/ 100
Recommended

Generally reliable with disclosed limitations; trial as directed and keep a rollback path.

See how it was scored ↓
Works as-is in
Codex · Claude Code
Stars
★ 3.2k
Last updated
17d ago
License
Apache-2.0
echartskline-chartcandlestickcanvas
+2visualizationdashboard

What does this skill do, and when should you use it?

This skill teaches the AI to emit a fenced code block tagged `DOJO_CHART` containing a JSON object with data and a rendering script, which the Dashboard frontend parses and renders as an interactive ECharts chart. It includes ready-to-use templates for candlestick, line, bar, and area charts, along with a dark theme color scheme. It is part of the DojoAgents full-market AI investment assistant framework.

When the user requests a chart, the AI outputs a DOJO_CHART block in its response. The block's JSON has two fields: data (an array of points, either OHLCV objects with time/open/high/low/close/volume or simple time/value objects) and script (a JavaScript function body that calls chart.setOption(...) to render). The skill provides templates for K-line, K-line with volume, line, bar, and area charts, and mandates a dark theme palette.

Good fit
  • A user asks 'Draw AAPL K-line on canvas' – the agent fetches kline data via a tool and outputs a candlestick chart block.
  • A user wants to compare volume across several stocks – the agent generates a bar chart.
  • A user requests a trend analysis of an indicator – the agent produces a smooth line chart.
  • A user wants to visualize cumulative portfolio returns – the agent uses an area chart.

How do you install this skill?

Before you use it
  • Skill depends on front-end DOJO_CHART parser, rendering will fail if not implemented.
  • Data fetching relies on user tools, tool failure may produce wrong charts.
  • License mismatch: SKILL.md says MIT, repository is Apache-2.0.
  • No install/dependency notes; chart rendering depends on ECharts loading.
  • Mainland China users should check ECharts CDN reachability.

This skill is part of the DojoAgents repository. To use it, install DojoAgents either via PyPI: create a virtual env with uv venv && source .venv/bin/activate then uv pip install dojoagents (no clone needed), or from source: clone the repo, create venv, and run uv pip install -e ".[dev]". The skill lives at dojoagents/skills/built_in/canvas-chart/.

Generic route: install into Claude Code manually (macOS / Linux)
tmp="$(mktemp -d)"
git clone --depth 1 https://github.com/Alpha-Dojo/DojoAgents.git "$tmp"
mkdir -p ~/.claude/skills
cp -R "$tmp/dojoagents/skills/built_in/canvas-chart" ~/.claude/skills/
rm -rf "$tmp"

Generated from the source repository and skill path; it copies only this skill's folder. If the author's install steps above differ, follow those first. To scope it to one project, replace ~/.claude/skills with that project's .claude/skills.

How do you use this skill?

Try saying

Once installed, send your agent any of these to trigger it:

  • Draw a candlestick chart for AAPL

In an Agent Skills-compatible client (e.g., Claude Code), copy the skill folder into your project's skills directory or configure per client. Then prompt the agent with something like 'Draw a candlestick chart for AAPL'. The agent will fetch data and output a DOJO_CHART block. The Dashboard Canvas frontend must be available to parse and render the block.

What are this skill's strengths and limitations?

Pros
  • Clear protocol with multiple chart templates ensure consistent, well-formed output.
  • Inline dark theme colors fit common dashboard designs.
  • Supports common financial chart types (candlestick, line, bar, area).
Limitations
  • Requires the DojoAgents Dashboard Canvas frontend to parse and render; won't work standalone.
  • Data array is limited to 200 points for performance; may need downsampling for high-frequency data.
  • No test suite or verification method documented; quality depends on model adherence to templates.

How does this skill compare with similar options?

Side by side with related skills; every score comes from the same FSRS standard.

Skill FS score Stars Last updated License
Canvas Chart Rendering Skill (ECharts) this page 59 · Recommended ★ 3.2k 17d ago Apache-2.0
Lieflat Charts 57 · Use with care ★ 6k 1mo ago NOASSERTION
OfficeCLI Data Dashboard Skill 57 · Use with care ★ 32k 5d ago Apache-2.0
CSV/Excel Deep Data Analysis Skill 47 · Use with care ★ 20k 7d ago MIT
Walmart Sales Data Deep Analyzer 32 · Not recommended ★ 20k 7d ago MIT

How did FollowSkills review this skill?

FollowSkills review · FSRS-2.0
Recommended
59/ 100 5-point scale 3.0 / 5
The upstream repository has new commits since this review. The score still applies to the reviewed revision shown and may not cover the latest changes.
1Trust15 / 25 · 3.0/5

The skill only instructs outputting DOJO_CHART blocks, it does not perform external operations or access files/network. No permissions requested, no sensitive data handling, risk low as it relies on ECharts rendering and front-end parsing. Data source provided by user tools, least privilege details unclear. Deduction: lacks user confirmation, data flow transparency limited, external library versions and supply chain security not mentioned.

2Reliability10 / 20 · 2.5/5

Skill provides clear protocol and templates, instructions self-consistent. However key path depends on user tools (e.g., dojo.sdk.get_stock_kline) and front-end DOJO_CHART renderer, not verified in skill file. Abnormal input (missing fields, non-numeric) not handled. No tests or execution evidence. Static review caps at 10.

3Adaptability12 / 15 · 4.0/5

Use cases clear (chart rendering), trigger conditions explicit, multiple chart templates provided. Boundaries not stated (unsupported chart types), non-fit scenarios undefined. Chinese support limited, dependency on ECharts and front-end may affect mainland China users. Environment fit evidence insufficient.

4Convention12 / 15 · 4.0/5

Documentation well-structured, version/author/license present, templates and examples provided. Missing install/dependency notes, changelog, maintenance responsibility and update path. License mismatch (MIT vs Apache). No FAQ or troubleshooting.

5Effectiveness7 / 15 · 2.3/5

Skill likely produces chart output, but relies on front-end parsing to actually render, static review cannot verify output usability. Example has only one point; data limits defined. No comparison with alternatives. Max 7.

6Verifiability3 / 10 · 1.5/5

Only textual examples, no tests or execution evidence. Rendering done by external front-end, cannot independently reproduce. Static review caps at 5, evidence thin so lowered to 3.

1 2 3 4 5 6

Open a dimension to read why it scored that way

Reviewed Aug 07, 2026 Reviewed revision 0d3389e6f373 Review evidence[1][2][3][4][5][6][7]

Evidence confidence:Low — Mostly static review, author material or a limited demo; useful for discovery, not high-risk decisions.

See the full review method →

FAQ

Can this skill be used outside DojoAgents?
The output is a standard code block, but it relies on the Dashboard Canvas panel to render; without that, it may not display.
How can I customize chart colors or styles?
You can modify the colors in the script, but ensure readability; the skill provides a dark theme baseline.
What if I have more than 200 data points?
The skill recommends sampling or truncating the data to keep arrays under 200 points.

More skills from this repository

All from Alpha-Dojo/DojoAgents

Related skills