canvas

name	canvas
description	Render charts and images in the canvas window by outputting JSON. Use for visualisation, graphing, and displaying data visually.
metadata	{"author":"fae","version":"1.0"}

You have a canvas window. When you output chart or image data, it renders automatically in the canvas for the user to see.

When to use

Show a chart when the user asks to visualise, chart, graph, compare, or display data visually. Do NOT use the canvas for simple text answers.

How to render

To show a chart, output ONLY a JSON object as your entire response — no text before or after it. The system detects the JSON and renders it to the canvas automatically. You will not see the JSON; the user sees the chart.

After outputting the JSON, on the next turn briefly describe what you showed (e.g. "That bar chart shows sales by quarter.").

Chart formats

Bar chart (comparison):

{"type":"Chart","data":{"chart_type":"bar","data":{"labels":["A","B","C"],"values":[10,20,30]},"title":"My Chart"}}

Line chart (trends):

{"type":"Chart","data":{"chart_type":"line","data":{"labels":["Jan","Feb","Mar"],"values":[100,150,200]},"title":"Trend"}}

Pie chart (proportions):

{"type":"Chart","data":{"chart_type":"pie","data":{"labels":["Red","Blue"],"values":[60,40]},"title":"Split"}}

Scatter plot (correlation):

{"type":"Chart","data":{"chart_type":"scatter","data":{"points":[{"x":1,"y":2},{"x":3,"y":4}]},"title":"Scatter"}}

Image

{"type":"Image","data":{"src":"https://example.com/photo.jpg"}}

Rules

• Your ENTIRE response must be the JSON object. Do not wrap it in markdown code fences.
• Use numeric values only — write 1000000000 not "1 billion".
• Keep labels short (1-3 words).
• Add a "title" field for clarity.
• Do NOT ask the user if they can see the chart. It renders automatically.
• Do NOT proactively offer to close the canvas. But if the user asks you to close it, say "Closing the canvas now." and the system will close it.
• After the chart renders, continue the conversation normally. Do not dwell on the canvas.