Fork of World Map

100%

Fork of World Map

✓ Published0🌍 Public

Last edited May 4, 2023

Created on May 4, 2023

This visualization shows a U.S. states map rendered as green polygons with black outlines against a light blue spherical background. It uses d3.geoAlbersUsa for the projection and d3.geoPath to generate SVG paths from TopoJSON data loaded from the us-atlas package. The code converts TopoJSON to GeoJSON using topojson.feature before binding the state features to SVG paths, while the sphere element is drawn separately using a GeoJSON Sphere object.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Polished World Map

This example displays a map of U.S. states filled with a teal color, rendered as SVG paths inside a React component. It uses the `d3.geoAlbersUsa` projection and `d3.geoPath` to convert TopoJSON state boundaries from the `us-atlas` dataset into visible shapes. The map is drawn within a React app that loads the data asynchronously via `useEffect` and the D3 `json` function, while the `topojson.feature` API extracts the state geometries.

Hhasti khajeh

86% match

Loading thumbnail…

Fork of USA Map

This example displays a filled map of the United States with orange sphere background, green land areas, and black state borders. It uses React with D3 v5 to load US Atlas TopoJSON data and render SVG paths through `d3.geoPath` with an Albers projection. The code applies `d3.geoGraticule` for grid lines and `topojson.mesh` to draw interior boundaries between states.

Bbhargavarathod

85% match

Loading thumbnail…

Fork of World Map

This interactive map visualization displays world countries and U.S. states using a selectable orthographic or Mercator projection. Users can drag to rotate the globe and click on countries to switch between projections, with a special case for the United States. Built with D3 v6 and d3-geo-projection, it renders geographic features via d3.geoPath, uses topojson for data parsing, and incorporates d3.drag and d3.zoom for interaction. The visualization loads world and U.S. atlas TopoJSON data from unpkg, with animations applied via D3 transitions.

GGlebenator

85% match

Loading thumbnail…

Fork of USA Country Map

This fork of the USA Country Map displays the 50 states using an SVG-based geographic projection. It colors each state green and shows white interior borders, with a hover effect that changes the fill to orange. The visualization uses `d3.geoPath` with the `geoAlbersUsaTerritories` projection, and loads geographic data from the `us-atlas` TopoJSON source. React manages the rendering, while D3 and TopoJSON handle the geographic feature and mesh processing.

DDonald Bagwell

85% match

Loading thumbnail…

Fork of Polished World Map

This example displays a map of U.S. states, rendered as outlined polygons using React and SVG. The map uses the `geoAlbersUsa` projection from D3 v5 and draws state boundaries with `d3.geoPath`. Geographic data is loaded from the U.S. Atlas TopoJSON, converted via the `topojson.feature` API, and styled with a teal fill on a light gray background. Although the README mentions world country boundaries and graticules, the current code focuses solely on U.S. state shapes.

KKeyvan Rezaei

85% match

Loading thumbnail…

Fork of Country map

This map of the United States renders all states and territories using an Albers projection, with landmasses filled in sky blue and interior borders drawn in teal. The visualization uses the geo-albers-usa-territories projection and d3.geoPath to convert TopoJSON features into SVG paths. Geographic data is loaded from the us-atlas package, while React’s useState and useEffect hooks manage the asynchronous data fetching and component rendering.

Bbhargavarathod

85% match

Loading thumbnail…

Fork of Country map

This example displays a map of the United States with its individual states filled in sky blue and state boundaries drawn in teal. It uses the `geoAlbersUsaTerritories` projection and `geoPath` from d3 to render geographic shapes as SVG paths, with data from the US Atlas TopoJSON. React manages the component state, loading the topology via `useData` and `topojson.feature` and `topojson.mesh` to extract land and interior boundaries.

SSaiSree0122

84% match

Loading thumbnail…

Fork of Country map

This choropleth displays all U.S. states as sky-blue filled polygons with teal borders marking state boundaries. Using the geo-albers-usa-territories projection via d3.geoPath, the map renders TopoJSON data from the us-atlas package. React manages the SVG output, while d3.geoGraticule and a mesh from topojson generate the underlying grid lines and interior state divisions.

Cchandrakalavanukuri

84% match