import React, { useState, useEffect, useRef, useMemo } from 'react';
import { motion, AnimatePresence } from 'framer-motion';
import { TrendingUp, Globe, BarChart3, Activity } from 'lucide-react';
const WIDTH = 1200;
const HEIGHT = 700;
const MARGIN = { top: 80, right: 120, bottom: 60, left: 180 };
const BAR_HEIGHT = 40;
const BAR_GAP = 15;
const COUNTRIES = [
{ id: 'USA', name: '美国', color: '#3b82f6', flag: '🇺🇸' },
{ id: 'CHN', name: '中国', color: '#ef4444', flag: '🇨🇳' },
{ id: 'JPN'