Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

A9 - Proportional symbols map

Public visualization

Viewing a saved revision (read-only)

e1a2c785eb6840f8a5f5249f9e0f7941

A9 - Proportional symbols map

1 star3🌍 Public
DDuc Pham
Last edited Apr 8, 2024
Created on Apr 7, 2024

This map of the United States visualizes transportation costs by state using proportional green and grey circles, with the ten most expensive states highlighted in brown. A tooltip displays the exact cost when hovering over a circle. The chart is built with D3 v3 and topojson, using an SVG path with `path.pointRadius` to size symbols by a square-root scale. A hand-coded legend, an animated tooltip via `div.transition`, and state boundary paths rendered from TopoJSON complete the interactive display.

AI-generated description

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

See also React Starter.