Fork of NewYorkCounty

100%

Fork of NewYorkCounty

✓ Published0🌍 Public

Last edited Dec 12, 2023

Created on Dec 12, 2023

This fork of NewYorkCounty displays a state of the US with its counties as an interactive SVG map, emphasizing a clean white and black aesthetic. The visualization's central mechanism is a dropdown selector that switches between states. Clicking on a county slides in a sidebar with its name, while hovering highlights the county in orange and shows a tooltip. It leverages d3.geoPath with a geoIdentity projection to render the map, and uses topojson-client to parse the US-10m TopoJSON file. All county and state geometry is drawn as SVG paths, with animated transitions on hover.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of HTML Starter

This visualization shows all counties in New York State as a clean, minimalist SVG map. It filters county features from the US Atlas TopoJSON dataset using the state FIPS code 36. The map is rendered with D3.js v7, using `d3.geoPath` and a scaled `d3.geoAlbersUsa` projection to draw each county boundary with a soft fill and dark stroke.

NNita

87% match

Loading thumbnail…

NewYorkCounty

This example shows a choropleth-style interactive map of New York County and its surrounding counties, rendered with SVG paths. Users select a US state from a dropdown menu, which triggers an animation as the map re-centers and re-scales to fit the selected state using `d3.geoIdentity` and `d3.geoPath`. Hovering over a county highlights it in orange and displays its name in a tooltip. The visualization uses `topojson.feature` to parse US county and state boundaries from the `us-10m.v2` TopoJSON file, with data from `county_data.tsv`.

Kkenny-wq

86% match

Loading thumbnail…

Untitled

This example visualizes the counties of New York State using a Transverse Mercator projection, with state boundaries outlined and counties filled in gray. Hovering over a county highlights it in light blue. The code loads US TopoJSON data via `d3.json`, extracts New York using `topojson.feature`, and applies a clipping path to restrict county paths to the state outline. It uses `d3.geo.path` for rendering and `path.bounds` to auto-fit the projection scale and translation.

AAnnie Ulichney

82% match

Loading thumbnail…

NY Counties

This example presents a map of New York State counties, colored white with gray borders, against a backdrop of the broader U.S. boundary with a subtle drop-shadow effect. Hovering over a county highlights it in crimson and displays its name and population in an overlay. The visualization uses D3 v4 with `d3.geoPath` and a transverse Mercator projection, loading TopoJSON county geometries and population data from a GitHub repository. The map renders as SVG, leveraging a blur filter and `topojson-client` for feature conversion and state boundary meshing.

MMTClass

82% match

Loading thumbnail…

Fork of NYS Map TEST TEST TEST

This interactive map displays the counties of New York State, rendered as white regions with black outlines. It uses a custom Albers equal-area conic projection applied via `geoAlbersUsa()` and `geoPath` from D3 v5, with React managing the SVG output. The geographic data originates from a JSON file fetched with `d3.json` and processed using `topojson` functions `feature` and `mesh`. On mouse hover, the code logs an event to the console.

Llupica.matthew@gmail.com

82% match

Loading thumbnail…

map: NY Counties

This interactive map displays New York State counties using a glitchy, layered rendering technique. The visualization uses D3’s geoAlbersUsa projection and geoPath to render county boundaries from a TopoJSON source, with hover effects that highlight individual counties. The map also includes world landmasses and graticules, creating an overlapping collage effect where the state’s counties appear superimposed on global geography. React manages the component state while D3’s json and topojson.feature APIs load and parse the geographic data for SVG rendering. The stylized CSS uses semi-transparent fills and hover states to emphasize the experimental aesthetic.

Zzach b.

81% match

Loading thumbnail…

NY Counties

This visualization displays New York’s counties on a map, colored white with gray borders, and highlights each county in crimson on mouseover while showing its name and population in an info box. It uses d3.geoPath with a transverse Mercator projection, d3.queue to load TopoJSON county boundaries and population data, and topojson-client to convert geometries. The map also includes a blurred drop shadow and white overlay for a layered effect, with state boundaries drawn as a mesh.

MMTClass

81% match

Loading thumbnail…

Untitled

This example displays an interactive SVG map of New York State’s counties, rendered in light gray with black borders that highlight in light blue on hover. It uses D3 v3 with the Albers projection and `d3.geo.path` to draw the geographic features, filtered from a TopoJSON file by state FIPS code 36. The map loads county boundaries from a remote GitHub-hosted dataset, while an accompanying test file defines a tooltip with `d3.tip` for potential data annotations.

AAnnie Ulichney

81% match