Skip to main content
100%

D3 - Proportional Symbols

✓ Published0🌍 Public
CChandana Srinivas
Last edited Apr 1, 2024
Created on Apr 1, 2024
Forked from HTML Starter

A proportional symbol map displays the relative housing costs across U.S. states, with circle size scaled by cost and red highlighting the top ten most expensive states. The visualization uses D3 v3 with `d3.geo.path` to render state boundaries from TopoJSON, while centroid points are drawn as scaled circles using `d3.scale.sqrt`. Hovering reveals a tooltip with state name and cost. The code loads external JSON and CSV data via `queue()`, and renders in SVG with animated transitions for the tooltip. The legend shows circle radii corresponding to cost values.

AI-generated description

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

See also React Starter.

MIT Licensed

Similar vizzes