advanced-data-visualization

name	advanced-data-visualization
description	Chart.js/D3.js expertise for interactive dashboards, complex charts, and political data visualization
license	CC-BY-4.0

Advanced Data Visualization Skill

🔴 AI FIRST Quality Principle

Apply the AI FIRST principle: never accept first-pass quality. Minimum 2 iterations. Read all output, improve every section. No shortcuts.

Purpose

Expert knowledge in creating interactive, accessible data visualizations using Chart.js and D3.js for complex political intelligence data.

Core Principles

1. Accessibility First - WCAG 2.1 AA compliant
2. Responsive Always - Mobile-first design
3. Performance Critical - Optimize for large datasets
4. Clarity Over Complexity - Clear data storytelling
5. Interactive Insight - Enable user exploration

Enforces

• Chart.js bar/line/scatter/pie charts
• D3.js network/force/geo diagrams
• Interactive tooltips and legends
• Responsive chart design
• Screen reader compatibility
• Performance optimization (lazy loading, canvas vs SVG)

Chart Types

• Election Forecasting: Confidence intervals, seat predictions
• Risk Heat Maps: Multi-dimensional risk scoring
• Network Diagrams: Influence and power structures
• Time Series: Historical trends (50+ years)
• Scatter Plots: Correlation and clustering
• Sankey Diagrams: Coalition flows

When to Use

• Creating interactive dashboards
• Visualizing complex datasets
• Building political intelligence displays
• Network/influence mapping
• Time series analysis

References

• Chart.js Documentation
• D3.js Gallery
• WCAG 2.1 Guidelines

---

Version: 1.0 | Last Updated: 2026-02-06 | Category: UI/UX & Design