1 BMW volume of sales

Stacked Bar Chart with HTML

This stacked bar chart displays BMW sales volume by region across years from 2010 to 2024, using aggregated data from a CSV file. The visualization uses D3 v7’s `d3.rollups`, `d3.stack`, and `d3.scaleBand` to group and stack regional sales contributions per year into a single SVG. Color-coded segments represent five regions, with axes, grid lines, and a legend generated via `d3.axisBottom`, `d3.axisLeft`, and ordinal color scaling. Sales values are aggregated with `d3.sum` and formatted in thousands on the y-axis.

90% match

Bar Chart of BMW volume of sales

This bar chart shows BMW sales volumes over time, grouped by year and colored by the region. Each year displays a cluster of bars representing different global markets, such as the USA, Brazil, and China. Users can click on a country in the legend to highlight its bars in a specific color while dimming others to grey. Built with D3.js v7, the visualization uses `d3.rollups` to aggregate sales data from a CSV file and `d3.scaleOrdinal` for color mapping, with a tooltip providing detailed data on hover.

89% match

Bar Chart of BMW volume of sales with Hover

This grouped bar chart displays BMW sales volume by year from 2010 to 2024, with bars segmented by six global regions mapped to representative countries. The visualization uses D3 v7 with an SVG rendering, employing `d3.rollups` to aggregate data from a CSV file and `d3.scaleBand` for each year’s sub-groups. Hovering reveals a tooltip showing detailed metrics, while the color-coded legend distinguishes regions that are dimmed when deselected.

89% match

1 Final Stacked Bar Chart with HTML

This stacked bar chart visualizes BMW sales volumes from 2010 to 2024, segmented by car model with interactive region filtering. The animation, implemented with D3.js v7, smoothly transitions between regions while hovering over bars reveals detailed tooltips. The visualization uses SVG rendering with d3.stack for stacking and d3.rollups for data aggregation, sourced from a CSV file containing model, year, and regional sales data.

89% match

BMW World map sales

This stacked bar chart shows BMW sales volume by year, broken down across five regions (Asia, North America, Europe, South America, Middle East, and Africa), with regions color-coded and clickable to toggle their visibility by turning bars white. The visualization aggregates the CSV data using `d3.rollups` to sum `Sales_Volume` per year and region, then renders the result as stacked bars with `d3.stack`, scales via `d3.scaleBand` and `d3.scaleLinear`, and includes axes, grid lines, and an interactive legend for filtering regions.

Bar Chart of BMW volume of sales with Hover

This bar chart displays BMW sales volumes by region for 2022, using the `Sales_Volume` field from `data.csv`, aggregated via `d3.rollups`. Each bar is colored by its corresponding country, and hovering over a bar highlights it in black while dimming others, showing a tooltip with the exact sales figure. The visualization uses D3.js v7's SVG rendering, with scales created via `d3.scaleLinear` and `d3.scaleBand`, and interactive hover events implemented through D3's `.on('mouseover')` and `.on('mouseout')` handlers.

New Bar Chart of BMW volume of sales with Hover

A grouped bar chart displays BMW sales volume from 2010–2024 across six regions, mapped to representative countries (e.g., Asia to China, Europe to Germany). The d3.v7 code aggregates the CSV data with d3.rollups, renders bars via SVG, and uses d3.axisBottom and d3.axisLeft for axes. A hover tooltip reveals exact values, while the color legend identifies each region.

Clickable Stacked Bar Chart with HTML

This stacked bar chart shows BMW sales volumes by year, broken down by region, with each segment colored according to its region. The visualization is built using D3 v7 with SVG rendering, and it also includes a clickable legend. Clicking a legend item or a bar segment toggles the highlight for that region, turning the selected elements white. The chart loads data from a CSV file and aggregates sales volumes using `d3.rollups` and `d3.sum`, with axes and grid lines configured via `d3.axisBottom` and `d3.axisLeft`.