Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

F1 BMW Global Sales Analytics Dashboard

Public visualization

Post on XLinkedIn

Viewing a saved revision (read-only)

c3a67206559c431ba515e539ed45224c

Open

F1 BMW Global Sales Analytics Dashboard

0 stars0🌍 Public
BBismark Kofi Owusu Sarfo
Last edited Dec 3, 2025
Created on Dec 3, 2025

This dashboard presents BMW sales analytics across a dark-themed interface, displaying key performance indicators, yearly trends, body style distribution, color breakdown, dealer regions, and a company-wise sales table. Users can filter data by region, body style, transmission, and fuel type through interactive dropdowns. The visualization uses D3.js v7 to render SVG charts with animated updates and tooltips, while clicking any chart opens a magnified modal view. The dashboard processes a CSV dataset of 49 BMW vehicle records, converting data types and computing aggregated metrics for real-time visualization.

AI-generated description

BMW Sales Dashboard

A professional, single-page dark-themed dashboard for analyzing BMW vehicle sales data with interactive filtering and real-time visualizations.

Features

  • Single-Screen Layout: Fits entirely on laptop screens (1366×768 and above) without scrollbars
  • Interactive Filtering: Filter data by Region, Body Style (Model), Transmission, and Fuel Type
  • Real-Time Updates: All charts update instantly when filters change
  • Dark Theme: Premium dark navy and charcoal color scheme with accent yellow-green highlights
  • Responsive Charts: SVG-based visualizations that scale to fit their containers
  • Rich Visualizations:
    • KPI Cards: YTD Total Sales, YTD Cars Sold, YTD Average Price
    • Weekly Sales Trend (Area Chart)
    • Sales by Body Style (Pie Chart)
    • Sales by Color (Donut Chart)
    • Sales by Dealer Region (Stacked Horizontal Bar)
    • Company-wise Sales Table

Files

  • index.html - Main dashboard HTML with dark theme styling
  • script.js - D3.js-based data visualization and interaction logic
  • data.csv - BMW sales dataset (45 records, 11 columns)

Data Structure

The dataset includes:

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

Getting Started

  1. Save all files in the same directory
  2. Open index.html in a modern web browser
  3. Use the filter panel on the left to explore different data segments
  4. Hover over chart elements for detailed tooltips

Color Scheme

  • Background: Dark Navy (#111827)
  • Cards: Dark Charcoal (#1F2937)
  • Text: Light (#F9FAFB)
  • Accents: Yellow-Green (#FACC15)
  • Chart Colors: Pink, Orange, Cyan, Purple, Emerald, Amber, Red, Blue, Indigo, Teal

Compatibility

  • Modern browsers (Chrome, Firefox, Safari, Edge)
  • Requires D3.js v7
  • No server required - runs entirely client-side

Performance

The dashboard is optimized for:

  • Fast filtering and re-rendering
  • Smooth animations and transitions
  • Responsive design that adapts to window resizing
  • Efficient SVG rendering with viewBox for proper scaling