skills.rest
alistaircroll
alistaircrollCOMMUNITY
Explore all skills by this author →
GitHub

visualization

Generates charts, maps, tables, and CSV exports from Montréal open data query results.

1|Updated Mar 13, 2026
Search Tags:#react#visualization#maps#open data#svg charts#csv export#montreal
One-click install
npx skills add https://github.com/alistaircroll/montreal-open-data --skill visualization-alistaircroll
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: visualization
Source: https://github.com/alistaircroll/montreal-open-data/tree/main/skills/analysis/visualization
Command: npx skills add https://github.com/alistaircroll/montreal-open-data --skill visualization-alistaircroll

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? AI agents cannot render browsers, so raw query results from Montréal's open data portal need to be transformed into formats users can actually view: inline SVG charts, text tables, map links, CSV files, or React components. ## Core Features & Use Cases - Text Tables: Format small result sets (< 20 rows) as aligned text tables directly in chat. - SVG Bar Charts & Map Links: Generate inline SVG visualizations for HTML-capable clients and OpenStreetMap/Google Maps links for geographic points. - CSV Export & React Components: Export records to CSV for Excel/Tableau or scaffold Recharts-based dashboards for interactive artifacts. - Use Case: After querying tree counts per borough via the CKAN SQL API, render a borough comparison as an SVG bar chart using Montréal's civic color palette, or export the full dataset to CSV for the user's own analysis tools. ## Quick Start Ask the agent to visualize the top 10 boroughs by tree count as a bar chart using the visualization patterns.

Frequently Asked Questions about visualization

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I visualize CKAN open data query results in a chat agent?▼

Format small result sets as aligned text tables directly in chat, or generate inline SVG bar charts for clients that render HTML. For geographic points, provide OpenStreetMap or Google Maps links built from latitude and longitude values.

How to generate an SVG bar chart from API records in Python?▼

Compute bar widths proportional to each record's value, then emit SVG rect and text elements positioned per row. The pattern scales bar width against the maximum value and labels each bar with its category and formatted count.

Can an AI agent export query results to CSV for Excel?▼

Yes, use Python's csv.DictWriter to convert API records into CSV text, dropping internal fields like _id. Writing with utf-8-sig encoding ensures accented French characters display correctly in Excel.

What chart library works for React dashboards from open data?▼

The skill uses Recharts with a BarChart component fed by records fetched from the CKAN datastore_search_sql endpoint. A vertical layout with borough names on the Y axis suits long category labels.

When should I use a map link instead of a chart for location data?▼

Use map links for single locations or small point sets where geographic context matters more than comparison. For many points, link to the CKAN portal's built-in resource map view instead of generating individual links.

Related Skills

Explore More Data & Analytics Skills→
thecolab-aithecolab-ai
24

data-govt-nz

Retrieve New Zealand open-data catalogue metadata via the CKAN API.

Official
Basic
anyreachaianyreachai
1

demo-bot-usage-report

Analyze chatbot conversation CSVs to generate visual dashboards and PDF reports.

Official
Intermediate
mikkelkrogsholmmikkelkrogsholm
2

dst-join-analysis

Generate executable SQL join patterns for multi-table DST analysis in DuckDB.

Community
Advanced
HKU-MMLabHKU-MMLab
39

python-dataviz

Generate static and interactive charts from data using matplotlib, seaborn, and plotly.

Official
Intermediate