Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Making a Bar Chart

Public visualization

Viewing a saved revision (read-only)

4d65b2b8a5ad4619b5c7c09d11e91a14

Making a Bar Chart

0 stars1🌍 Public
PPushkov Fedor
Last edited Jul 5, 2020
Created on Jul 5, 2020
Forked from Face with D3.js

This example shows a horizontal bar chart comparing esports teams by their total earnings, using a CSV dataset loaded from `data.csv`. The visualization renders as SVG, with each team represented by a steelblue rectangle sized according to its earnings value. The code imports specific D3 v5 modules—`csv`, `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom`—to parse the data, map earnings to a linear x-scale and team names to a banded y-scale, and generate the corresponding axes. Margins and an inner plotting area are defined to position the chart within a 960×500 SVG canvas.

AI-generated description