Skip to main content
SimilarExport ZIP
100%

Bar chart

✓ Published0🌍 Public
Llohitsai.nikkil@gmail.com
Last edited Oct 19, 2025
Created on Oct 19, 2025
Forked from HTML Starter

This bar chart displays the top 20 smartphone models by units sold, with each bar’s length representing millions of units and its color indicating the brand. Hovering reveals a tooltip with price, rating, and battery life. Built with React and D3 v5, it uses `scaleBand` and `scaleLinear` for axes, `scaleOrdinal` with `schemePastel1` for color, and parses a single-line CSV dataset via `csvParse` after normalization. The SVG renders with grid lines, tick labels, and value annotations.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Bar chart

This horizontal bar chart ranks the top 20 smartphone models by units sold (in millions), with each bar colored by brand using a pastel ordinal scale. The visualization uses React 16.9 and D3 v5, employing `scaleBand` for the categorical y-axis, `scaleLinear` for the numeric x-axis, and `scaleOrdinal` for color encoding. Data is fetched from a remote CSV, normalized from single-line format, and rendered as SVG rectangles with tooltips showing price, rating, and battery life.

Llohitsai62@gmail.com
96% match
Loading thumbnail…

Bar chart

A horizontal bar chart ranks the 20 best-selling smartphone models by units sold, using a dark theme and brand-based color gradients. Built with React and D3 v6, it loads CSV data, sorts and slices it, then renders SVG bars with hover tooltips, gridlines, and labels. The chart maps model names to the y-axis and units sold to the x-axis, with D3’s `scaleBand` and `scaleLinear` handling layout and `scaleOrdinal` assigning colors.

Llohitsai62@gmail.com
95% match
Loading thumbnail…

bar chart

This bar chart compares smartphone models by units sold in millions, using a vertical bar encoding to show each model’s total sales. The visualization is built with React 16.9 and D3 v5, where a `d3.scaleBand` positions the categorical model labels on the x-axis and a `d3.scaleLinear` maps the numeric sales values to bar heights. Data is loaded as CSV via `d3.csv`, and the SVG bars are rendered with rotated x-axis tick labels to accommodate the long model names.

Llohitsai.nikkil@gmail.com
92% match
Loading thumbnail…

BAR CHART

A dark-themed bar chart ranks smartphone brands by total units sold in millions. Summed via `d3.rollups` and sorted descending, each brand appears as a blue bar with value labels, using a band scale for categories and a linear scale for counts. The CSV is fetched from a GitHub Gist, parsed with `d3.csvParse` and `d3.autoType`, then rendered as SVG with gridlines and rotated axis labels generated through `d3.axisLeft` and `d3.axisBottom`.

Llohitsai.nikkil@gmail.com
87% match
Loading thumbnail…

Bar Chart

This bar chart displays the weight of 20 car models, using a horizontal layout where each car name is listed on the y-axis and its corresponding weight extends along the x-axis. Built with React and D3.js v5, it employs `scaleBand` for the categorical y-axis and `scaleLinear` for the numeric x-axis, rendering bars as SVG rectangles. The chart loads data from a CSV file via a custom `useData` hook, includes formatted tick labels that convert gigabytes to billions, and provides tooltips on hover.

Aanith462@gmail.com
80% match
Loading thumbnail…

Scatter plot

This dark-themed scatter plot shows the relationship between units sold and total sales for smartphone models, with each point colored by brand and sized by average rating. Hovering reveals a tooltip with model details. Built with D3 v7, the visualization loads CSV data, applies linear scales for axes and a color scale for brands, and uses SVG circles with mouse events for interactivity.

Llohitsai62@gmail.com
79% match
Loading thumbnail…

sp

A scatter plot displays smartphone models by price on the x-axis and battery life on the y-axis. Each dot encodes brand through color and average rating through size, with a legend explaining the mappings. Built with D3 v7, the visualization uses SVG rendering and includes interactive tooltips that appear on hover. The data comes from a CSV file fetched via URL and parsed with D3's CSV parser, with custom text preprocessing to handle single-line formatting. Axis gridlines and styled panels enhance readability within a dark theme.

Llohitsai.nikkil@gmail.com
78% match
Loading thumbnail…

A6_Q2

A stacked bar chart visualizes smartphone market share across five price ranges—Low, Mid, High, Premium, and Ultra Premium—for six brands. Each horizontal bar represents a brand, with colored segments depicting the proportional share in each price tier. The code uses D3.js v7, building an SVG with `d3.select`, `d3.scaleBand`, and `d3.scaleLinear` for axes, and `d3.stack` to aggregate the data. Color mapping is handled via `d3.scaleOrdinal`, and a legend is manually constructed using `svg.append`. The synthetic dataset defines share values for each brand and price range.

SShashankkodishala@my.unt.edu
78% match