Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Creating a Rectangle Chart

Public visualization

Creating a Rectangle Chart

0 stars1🌍 Public
Jjr873
Last edited May 8, 2021
Created on May 8, 2021
Forked from FaceMaker

This example demonstrates a horizontal bar chart from the `products.csv` dataset, ranking products by their numeric attribute values. The chart uses an SVG canvas with a linear scale for bar lengths and a band scale for categorical product names, rendered via D3 v6’s `scaleLinear`, `scaleBand`, and `axisLeft`/`axisTop` APIs. Bars are drawn directly as SVG rectangles, with steelblue fills and compact axis labels. The setup processes CSV data and maps product names to the vertical axis while attribute values determine bar heights, producing a straightforward comparison of product metrics.

AI-generated description

Comments

Sign in to join the discussion.

MIT Licensed