ICE 6 Bar chart of US Economic indicators

100%

ICE 6 Bar chart of US Economic indicators

✓ Published0🌍 Public

Ddiwashhumagain@my.unt.edu

Last edited Oct 18, 2025

Created on Oct 18, 2025

Forked from Ice6

This bar chart displays economic indicators for the United States, using a horizontal layout where each category is represented by a teal bar scaled to its quantitative value. Built with React and D3, the visualization loads CSV data from a GitHub gist and renders it as an SVG. The code leverages D3's `csv` parser, `scaleBand` for the categorical y-axis, and `scaleLinear` for the numeric x-axis, with custom tick marks and labels drawn for both axes. The chart includes a title and axis labels, showing up to ten data entries.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

ICE - 6 Bar Graph

The visualization displays a bar chart comparing the population of U.S. states, sourced from a CSV file. It uses React with D3 v5 to render SVG bars, where each bar’s height and color vary by population value. The code employs `d3.scaleBand` and `d3.scaleLinear` for axes, with `d3.axisBottom` and `d3.axisLeft` to generate the scales, and formats population values by stripping commas.

84% match

Loading thumbnail…

ICE 6 Bar Chart

This bar chart visualizes the growth of the U.S. M2 money supply in billions of dollars over time, using a horizontal bar layout where each bar represents a year. The React-based example loads CSV data via `d3.csv` and employs `scaleBand` and `scaleLinear` from D3 v5 to position bars and axes, rendering everything as SVG. It features custom gridlines, formatted tick labels, and rounded bars with hover effects and drop shadows, all styled through CSS to create a clean, modern presentation.

Ddiwashhumagain@my.unt.edu

84% match

Loading thumbnail…

ICE-6

A bar chart displays the GDP of fifteen countries, sourced from a CSV file. The visualization uses React to manage state and render an SVG, with D3 v5 functions for data loading (`d3.csv`), scaling (`d3.scaleBand`, `d3.scaleLinear`), and axis generation. Rectangles encode GDP values along a horizontal scale with labeled ticks.

JJasvitha Allamsetty

82% match

Loading thumbnail…

ICE-6 Bar Charts

A horizontal bar chart displays the GDP per capita for 15 countries, sourced from a CSV file. The chart uses SVG for rendering and is built with React, D3 v5, and D3's scaleBand and scaleLinear for axis scaling. It uses D3's csv loader and max functions, and renders the chart with a blue gridline, labeled axes, and colored bars.

MMounikadontireddy

82% match

Loading thumbnail…

ICE_6

This horizontal bar chart displays population estimates for a subset of US states using React and D3 v5. The visualization maps state names to the y-axis and population values to scaled bar widths on the x-axis. Population data is loaded from a CSV file via `d3.csv`, parsed with `parseInt`, and sliced to 11 records. The chart uses `d3.scaleBand` for categorical y-positions and `d3.scaleLinear` for quantitative scaling, with SVG `rect` marks for bars and manual axis tick rendering via `xScale.ticks()`.

Cchilukuritagore1427@gmail.com

81% match

Loading thumbnail…

ICE-6

This bar chart displays sales data for various items, with horizontal bars showing the sale amount for each item. The visualization uses React and D3 v5, loading CSV data via `d3.csv` and rendering SVG elements with `scaleBand` for the categorical y-axis and `scaleLinear` for the numeric x-axis. Gridlines and axis labels are generated manually using `xScale.ticks()`, while the data values are encoded as rectangle widths.

HHARSHA BUDDANA

81% match

Loading thumbnail…

ICE-6 DV

A horizontal bar chart displays the top 10 most populous US states, ranking them by their 2019 population values. The visualization loads data from a CSV file using `d3.csv`, then scales the bars with `d3.scaleBand` and `d3.scaleLinear`. The chart is built with React components and rendered as SVG, with axis ticks and grid lines generated manually from the scales. The interface includes a title and a loading state while data is being fetched.

Ssowmyanagula@my.unt.edu

81% match

Loading thumbnail…

ICE-6 DV

This example displays a horizontal bar chart comparing the population of the first 20 U.S. states from a CSV dataset. Built with React and D3 v5, it uses `d3.csv` to load data, `scaleBand` for the y-axis categories, and `scaleLinear` for the x-axis values. The SVG rendering includes custom axis ticks and blue grid lines, with `rect` elements representing each state’s population.

Ssowmyanagula@my.unt.edu

81% match