Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Shapes and Colors with SVG and CSS

Public visualization

Viewing a saved revision (read-only)

3f95f0c9c2fd4ca2a2f0e45a9b98f759

Shapes and Colors with SVG and CSS

0 stars1🌍 Public
OOsekovS
Last edited Aug 11, 2020
Created on Aug 11, 2020

This example shows a horizontal bar chart of country populations using SVG shapes styled with CSS. The bars are drawn as `rect` elements with a pink fill, and the chart includes axes rendered via D3’s `scaleLinear`, `scaleBand`, `axisBottom`, and `axisLeft`. Population values from a CSV file are loaded with `csv()` and scaled against the chart’s width, while `selectAll` and data joins append the rectangles. The code relies on D3 v5 and SVG, with CSS controlling font size and rectangle color.

AI-generated description

An example including some commonly used features of SVG.