Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

scale svg

Public visualization

Viewing a saved revision (read-only)

d52ced3e71e445faa588f80472724103

scale svg

0 stars0🌍 Public
Yyar
Last edited Jun 1, 2022
Created on Jun 1, 2022
Forked from HTML Starter

This example demonstrates how to create a responsive SVG visualization using D3 v7. It displays five small rectangles positioned horizontally within a 400x400 viewBox, with each rectangle’s x-coordinate determined by its data value. The code uses `d3.select` to append an SVG element and applies the `viewBox` and `preserveAspectRatio` attributes to ensure the graphic scales proportionally to its container. The rectangles are bound to the array `[1,2,3,4,5]` using D3’s data join pattern with `selectAll`, `data`, and `enter`.

AI-generated description