skills.rest
warrenrross
warrenrrossCOMMUNITY
Explore all skills by this author →
Website𝕏@warrenrrossGitHub

world-coffee-trade

Convert bilateral trade CSV data into interactive D3.js world map visualizations.

Updated Apr 11, 2026
Search Tags:#pandas#d3.js#data-visualization#github-pages#choropleth#topojson#coffee-trade
One-click install
npx skills add https://github.com/warrenrross/World_Coffee_Trade --skill world-coffee-trade
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: world-coffee-trade
Source: https://github.com/warrenrross/World_Coffee_Trade/tree/main
Command: npx skills add https://github.com/warrenrross/World_Coffee_Trade --skill world-coffee-trade

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill solves the complexity of building production-grade, interactive data visualizations from raw trade datasets, eliminating the need to manually piece together data processing, mapping libraries, and deployment pipelines.

Core Features & Use Cases

  • Full-stack data visualization: Acquire, clean, and process bilateral trade data with Python/Pandas, then render interactive D3.js choropleth maps with flow arcs.
  • Time-series animation: Step through years of trade evolution with playback controls, log-scaled color ramps, and dynamic arc rendering that handles outlier-dominated datasets.
  • Responsive deployment: Host on GitHub Pages with mobile touch support, zoom/pan, and interactive tooltips — all without build tools or frameworks.

Quick Start

Use the world-coffee-trade skill to transform the BACI coffee trade CSV into an interactive year-by-year world map visualization and deploy it to GitHub Pages.

Frequently Asked Questions about world-coffee-trade

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

FAQPage Schema
How do I turn bilateral trade CSV data into an interactive D3.js choropleth map?▼

To build interactive D3.js choropleth maps from trade CSV data, aggregate the raw figures with Python and Pandas, then render the geographic output using D3.js v7 and TopoJSON geometry.

What is the best way to visualize time-series trade data with outlier-dominated datasets?▼

Visualizing outlier-dominated time-series trade data requires applying log-scaled color ramps and dynamic flow arc rendering to ensure extreme values do not skew the geographic map output.

Can I deploy an interactive data visualization to GitHub Pages without using build tools?▼

Yes, you can deploy interactive data visualizations to GitHub Pages without build tools by rendering static SVG outputs with mobile touch support, zoom, and pan features directly in the browser.

Does D3.js v7 support time-series playback controls for geographic flow diagrams?▼

D3.js v7 supports time-series playback for geographic flow diagrams by stepping through years of trade evolution with interactive playback controls and dynamic flow arc rendering.

Do I need Python to aggregate raw trade data before rendering a choropleth map?▼

Yes, you need Python with Pandas to clean, acquire, and process raw bilateral trade data into the structured format required for rendering D3.js choropleth maps.

Related Skills

Explore More Data & Analytics Skills→
Thiago-Cruz-engThiago-Cruz-eng

data-analysis

Analyze datasets to extract insights and produce structured reports.

Community
Intermediate
OpusGameLabsOpusGameLabs
307

game-deploy

Deploy browser games to static hosting via automated build and publish steps.

Official
Advanced
cloud-native-toolscloud-native-tools

draw-d3js

Generate interactive D3.js v7 visualizations as self-contained HTML documents.

Official
Intermediate
mattleonard16mattleonard16

d3-visualization

Create custom interactive D3.js charts with SVG rendering and ARIA labels.

Community
Intermediate