Skip to main content
SimilarExport ZIP
100%

Fork of ICE -6 (Bar Chart)

✓ Published0🌍 Public
Sskmriyaz0786@gmail.com
Last edited Oct 18, 2025
Created on Oct 18, 2025
Forked from 1. Bar Plot ICE -6

This horizontal bar chart shows the top 15 BMW car models ranked by sales volume, with each bar colored using a pastel ordinal scale from d3.scaleOrdinal. The data is loaded from a CSV file and sorted in descending order before display. Built with React and D3 v5, the visualization uses d3.scaleBand for the y-axis, d3.scaleLinear for the x-axis, and SVG elements for rendering bars with hover effects and tooltips.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of ICE-6_fork

This horizontal bar chart shows the top five BMW car models ranked by sales volume, with each bar color-coded and labeled with its sales figure. The chart loads CSV data from a GitHub Gist using d3.csv, then sorts and slices the dataset to display only the leading models. React manages the interactive tooltip that appears on hover, while D3’s scaleBand and scaleLinear handle the axis mappings. SVG rendering, combined with custom gridlines and value annotations, highlights the highest-selling model.

Sskmriyaz0786@gmail.com
95% match
Loading thumbnail…

Fork of ICE 6 Data Visualization

This bar chart displays the sales units for the top ten car models, ranked by name along the vertical axis. The visualization is built with React and D3 v5, using `scaleBand` and `scaleLinear` for axes, and SVG `rect` elements for bars. Data is loaded from a CSV file via `d3.csv` and rendered with a margin-based layout featuring a blue axis grid.

MMalempatiSaranya
88% match
Loading thumbnail…

ICE-6_fork

This horizontal bar chart displays the top 10 car models by price, sorted from highest to lowest, with each bar assigned a distinct color from combined D3 color palettes. Built with React and D3 v5, the visualization renders as SVG and includes value labels at bar ends, gridlines, and an annotation for the highest-priced model. Hover interactions trigger a custom tooltip showing brand, price, and mileage. Data loads from a CSV file using d3.csv, with linear and band scales via scaleLinear and scaleBand.</s>

NNirupama Karanam
87% match
Loading thumbnail…

Fork of ICE-6 (Multi series chart)

This fork of ICE-6 displays BMW car sales data as a multi-series chart combining bar and line representations. The teal bars show average car price per year (rotated labels display values), while a red line with dots shows average mileage per year on a secondary right axis. The code loads CSV data from a GitHub gist, processes it in React state, then renders SVG using D3 v6 scales, axes, line generator, and selection APIs, with React managing the rendering lifecycle.

Sskmriyaz0786@gmail.com
85% match
Loading thumbnail…

Fork of ICE -6 (Scatter Plot)

This scatter plot visualizes BMW car sales by comparing car models against fuel types, with each point colored by sales classification (blue for low, orange for high). The visualization uses React with hooks to load CSV data via `d3.csv`, then renders an SVG with D3 scales including `scaleBand` for both axes. Axis labels are rotated for model names, and hover tooltips display detailed model, fuel type, and sales information for each data point.

Sskmriyaz0786@gmail.com
85% match
Loading thumbnail…

Fork of Refactored Bar Chart

This is a bar chart that ranks the top 10 BMW models by total sales volume from the provided dataset, which includes sales records with attributes like model, year, region, and sales volume. The chart uses a horizontal bar layout where bar length encodes sales volume, and each model is labeled on the y-axis. Built with React and D3 v7, the visualization computes aggregation via `d3.rollups` and `d3.sum`, then sorts and slices the data to highlight the highest-selling models. The layout uses `scaleBand` for the categorical y-axis and `scaleLinear` for the quantitative x-axis, with visual elements rendered as SVG rectangles, and axes are drawn using custom components and `d3.axisBottom`.

Ssaiabhishekmunnangi@gmail.com
85% match
Loading thumbnail…

Fork of ICE-6 Sheshidhar reddy cars

This bar chart shows the top 10 car models by unit sales, with each bar's length proportionally scaled to the number of units sold. The visualization uses React and D3 v5, with the `csv` function fetching data from a GitHub-hosted CSV file and `scaleBand` and `scaleLinear` mapping the categorical car names and numeric unit counts to pixel coordinates. The SVG rendering draws blue rectangle bars, axis ticks, and labels, while the `max` function determines the x-axis domain. The page title "Top car sales" frames the chart for the viewer.

SSheshidharreddy
84% match
Loading thumbnail…

Fork of ICE-6 Sheshidhar reddy cars

This bar chart shows the top 10 car models by unit sales, with each bar's length proportionally scaled to the number of units sold. The visualization uses React and D3 v5, with the `csv` function fetching data from a GitHub-hosted CSV file and `scaleBand` and `scaleLinear` mapping the categorical car names and numeric unit counts to pixel coordinates. The SVG rendering draws blue rectangle bars, axis ticks, and labels, while the `max` function determines the x-axis domain. The page title "Top car sales" frames the chart for the viewer.

SSheshidharreddy
84% match