Module: ChartUtils

Shared Chart Configuration & Utility Functions

Centralized utility module for Chart.js and D3.js visualizations across all 9 dashboard sections. Provides responsive configuration, empty/loading states, accessibility helpers, and cyberpunk theme integration.

Features

1. Responsive Chart Configuration: Mobile-first responsive options for Chart.js
2. Empty/Loading States: User-friendly fallback UI components
3. Accessibility Helpers: ARIA labels, keyboard navigation, screen reader support
4. Theme Integration: Cyberpunk color palette with CSS custom properties
5. Number Formatting: Swedish locale formatting (1,234,567)
6. Performance: Debounced resize handlers, lazy rendering

Usage Examples

// Responsive Chart.js configuration
const chart = new Chart(ctx, {
  ...ChartUtils.getResponsiveOptions('bar'),
  data: { ... }
});

// Show loading state
ChartUtils.showLoadingState('partyEffectivenessChart');

// Handle empty data
if (!data || data.length === 0) {
  ChartUtils.showEmptyState('partyEffectivenessChart', 'No party data available');
  return;
}