Skip to main content
SimilarExport ZIP
100%

Fork of Cities population dataset for ICE-5 assignment

✓ Published0🌍 Public
BBHUMIKA CHUNDU
Last edited Oct 17, 2025
Created on Oct 17, 2025

This bar chart visualizes the area of ten common geometric shapes, sourced from a CSV dataset loaded with `d3.csv`. Each shape is represented by a steelblue bar along the x-axis, with its height mapped to the numerical area value on the y-axis. The chart uses `d3.scaleBand` for categorical positioning, `d3.scaleLinear` for the value scale, and `d3.axisBottom` and `d3.axisLeft` to render the axes. Hovering over a bar changes its fill to darkorange.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Ice 6 bar

This bar chart displays population values for 100 synthetic cities, with each bar’s height representing the population count and hover tooltips revealing exact figures. The visualization uses D3.js v7 to load CSV data via `d3.csv`, scale the values with `scaleBand` and `scaleLinear`, and render the chart as SVG. Horizontal grid lines created with `axisLeft` improve readability, while the x-axis labels are rotated to accommodate the many city names.

HHarshithaDontha@my.unt.edu
82% match
Loading thumbnail…

Cities population dataset for ICE-5 assignment

This example shows a multi-series chart comparing city population and density, with blue bars for population values and a red line for density. The visualization uses D3 v7 to load CSV data from a GitHub gist, then renders an SVG with dual y-axes: population on the left and density on the right. The code employs `d3.scaleBand` for the categorical x-axis, `d3.scaleLinear` for both y scales, and `d3.line` to generate the density path. Rotated axis labels and a manual legend distinguish the two metrics.

BBHUMIKA CHUNDU
80% match
Loading thumbnail…

Fork of Fork of Fork of ICE-5: Loading and Parsing CSV Data with D3.js

This visualization demonstrates how to load and parse CSV data with D3.js, displaying a bar chart of population figures for the top ten countries from a GitHub-hosted ICE-5 dataset. It uses `d3.csv` to fetch and parse the data, `scaleBand` for the categorical y-axis, `scaleLinear` for the numeric x-axis, and SVG `rect` elements for rendering bars. The page also includes a text overlay reporting file size, row count, and column count.

Bbindhureddy98
78% match
Loading thumbnail…

Fork of Making a Bar Chart22

This bar chart displays population figures for ten countries from a CSV file, using horizontal bars sorted by country name. The visualization is built with D3 v5 and rendered as SVG, employing `scaleLinear` for the population axis and `scaleBand` for categorical spacing. The code loads data via `d3.csv`, transforms population values to numbers, and draws axes with `axisLeft` and `axisBottom`. Bars are appended as rectangles with widths proportional to population, styled with steelblue fills and a custom margin layout.

Ggaowxx@qq.com
78% match
Loading thumbnail…

Fork of Making a Bar Chart22

This bar chart displays population figures for ten countries from a CSV file, using horizontal bars sorted by country name. The visualization is built with D3 v5 and rendered as SVG, employing `scaleLinear` for the population axis and `scaleBand` for categorical spacing. The code loads data via `d3.csv`, transforms population values to numbers, and draws axes with `axisLeft` and `axisBottom`. Bars are appended as rectangles with widths proportional to population, styled with steelblue fills and a custom margin layout.

Ggaowxx@qq.com
78% match
Loading thumbnail…

Fork of Shapes and Colors with SVG and CSS

This bar chart displays the population of the top 10 most populous countries, with countries on the y-axis and population on the x-axis. It uses D3 v6’s `scaleLinear`, `scaleBand`, `axisBottom`, and `axisLeft` APIs to construct the chart within an SVG element. The data is loaded from a CSV file and rendered as steelblue rectangles, with gridlines and styled text via CSS.

Ssergey-kvachenok
77% match
Loading thumbnail…

Fork of Fork of ICE 6 Scatter Plot (Sai Kaushik Ganji)

A fork of a fork of an ICE 6 scatter plot, this visualization displays the populations of US cities as dots along a vertical city axis. Each dot’s horizontal position encodes its population in millions, while both its radius and blue color intensity scale with that value. Built with D3 v7, the code loads CSV data, uses `scalePoint`, `scaleSqrt`, and `scaleSequential`, and renders an SVG with gridlines, axes, labels, and interactive tooltips on mouseover.

Kkhushburajan2015@gmail.com
77% match
Loading thumbnail…

Fork of ICE-6: Rendering Marks and Channels (Bar Chart)

This bar chart displays the 2022 population of three countries from a CSV file, with each bar’s length encoding the population value. The visualization uses React to manage state and render the SVG, while D3 v5 provides the data loading via `csv`, scales (`scaleBand`, `scaleLinear`), and axis ticks. The chart includes purple vertical gridlines and labeled x- and y-axes, with bar heights fixed to the band width.

Mmanishcheruku
77% match