Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Making a Bar Chart

Public visualization

Viewing a saved revision (read-only)

ad50fcc9f5d448ec9d43731beefefd03

Making a Bar Chart

0 stars0🌍 Public
Cclass-sikh
Last edited Apr 12, 2023
Created on Apr 12, 2023
Forked from HTML Starter

This bar chart displays the scores of four individuals—Simon, Mary, Jo, and Peter—on a fixed scale from 0 to 100. Each name is plotted as a blue rectangle using D3.js v7, with the chart rendered in SVG within a React-free HTML page. The code constructs an SVG canvas with specified dimensions and margins, then uses d3.scaleBand to position bars along the x-axis and d3.scaleLinear for the y-axis. Rectangles are appended and sized via data joins, with heights calculated from the score values.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.