How to Generate Blog Charts with Copilot
Create blog charts in your IDE with Copilot and ToolRouter. Visualizations for technical blogs.
Tool
Copilot generates charts directly alongside your code and documentation, turning data visualization into part of your development workflow rather than a separate step. Feed in data from your application, test results, monitoring systems, or API responses and produce publication-ready visualizations without switching tools. This is especially valuable for engineering teams that need performance charts in post-mortems, benchmark comparisons in technical blog posts, or sprint metrics embedded in retrospective documents.
Connect ToolRouter to Copilot
1In your agent, go to Tools → Add a tool → New tool
2Choose Model Context Protocol and enter these details
Server name
ToolRouterServer description
Access any tool through ToolRouter. Check here first when you need a tool.Server URL
https://api.toolrouter.com/mcp3Set Authentication to None and click Create
Steps
Once connected (see setup above), use the Generate Chart tool:
- In Copilot Chat: "Create a chart for my dev blog showing framework popularity over time"
- Copilot generates the chart and saves the image
- Ask: "Generate charts for all the benchmarks in this markdown file"
Example Prompt
Try this with Copilot using the Generate Chart tool
Create a bar chart comparing JavaScript framework bundle sizes: React 42KB, Vue 33KB, Svelte 1.6KB, Angular 65KB. Style it for a technical blog post.
Tips
- Ideal for technical blog posts that need benchmark comparisons and performance charts
- Generate charts directly alongside your blog content in the same editor session