BMW Sales Animation

An interactive D3.js visualization showing BMW sales volumes across different regions, models, and years with animated bubble charts.

Features

• Animated Bubble Charts: Watch sales data evolve year by year
• Country Filtering: Toggle countries on/off via checkboxes
• Interactive Tooltips: Hover over bubbles to see detailed sales information
• Play/Pause Controls: Control the animation at your own pace
• Color-Coded Models: Each BMW model has a distinct color
• Responsive Layout: Grid lines and axis labels for easy data reading

Files

• index.html - Main HTML structure
• script.js - D3.js visualization and animation logic
• dataProcessor.js - Data processing and color mappings
• data.csv - BMW sales dataset

Data Structure

The dataset includes:

• Models: 3 Series, 5 Series, 7 Series, X1, X3, X5, X6, M3, M5, i3, i8
• Regions: North America, South America, Europe, Asia, Africa, Middle East
• Years: 2010-2024
• Metrics: Sales Volume, Price, Engine Size, Fuel Type, Transmission

How to Use

1. Open index.html in a web browser
2. The animation starts automatically
3. Use the checkboxes to filter by country
4. Click Play/Pause to control the animation
5. Hover over bubbles to see detailed information

Technologies

• D3.js v7
• HTML5
• CSS3
• JavaScript (ES6+)