Class 10

100%

✓ Published0🌍 Public

Last edited May 17, 2017

Created on May 17, 2017

This interactive map displays U.S. counties with a yellow draggable marker representing Washington, D.C. Users can reposition the marker to see which state it lands in, with a tooltip revealing the state’s name. The visualization uses d3.tile and d3.geoMercator with OpenStreetMap raster tiles, d3.geoPath for county outlines, and d3.drag for marker interaction. County data comes from a TopoJSON file, while earthquake data is loaded from USGS GeoJSON.

AI-generated description

Similar vizzes

Loading thumbnail…

Class 10

This interactive map lets users pan and zoom across the United States, with a red outline showing county boundaries overlaid on OpenStreetMap tiles. A yellow draggable circle marks Washington, DC, and when moved, it displays the name of the state containing the current point in a tooltip. The visualization uses d3-tile for raster tiles, d3.geoMercator and d3.geoPath for projections and vector rendering, topojson for county mesh data, and d3.zoom and d3.drag for interaction.

AAnaMal08

91% match

Loading thumbnail…

Class 10

This interactive map of Washington, D.C., overlays bike-sharing stations, hiking trails, and points of interest onto a zoomable Mercator projection. Users can hover over red station markers or green trail paths to see tooltips with addresses, bike counts, or trail lengths. Built with D3 v4, the example uses `d3.geoMercator` and `d3.geoPath` to render geographic features, while `d3.zoom` and `d3.tile` provide a smoothly scaling tile-based view. Data is loaded from three remote JSON files hosted on GitHub, and the interface supports mouse-based panning and zooming.

AAnaMal08

80% match

Loading thumbnail…

Class 10

A data-visualization example titled “Discovering D.C. by Bike” shows bike-sharing stations, bike trails, and tourist attractions across Washington, D.C., on an interactive zoomable map. It uses d3-geo with a Mercator projection and d3-tile for the basemap, while d3-zoom enables pan and zoom with tile scaling. Hovering over markers reveals tooltips, and a legend explains the symbols. The code loads three GeoJSON datasets from GitHub and renders all elements as SVG with animation support, using d3.v4 and d3-legend for the color legend.

AAnaMal08

78% match

Loading thumbnail…

US Map

This interactive visualization displays all US counties as a choropleth-style map rendered with a natural Earth projection using d3.geoPath. The map is drawn with SVG elements, featuring graticules and a sphere outline to provide geographic context. County boundaries come from a TopoJSON file loaded asynchronously and converted to GeoJSON features. Built with React and D3 v7, the visualization dynamically fills the browser window and uses the Poppins font for its minimal interface.

JJohn Lewis

77% match

Loading thumbnail…

country map

This visualization displays a map of the United States at the county level, using a green fill with black borders that highlight individual county boundaries. Hovering over any county changes its fill color to yellow. The map is rendered as SVG using D3 v5, with geographic projections handled by `d3.geoAlbersUsa` and `d3.geoPath`. County boundaries are generated from TopoJSON data loaded from the us-atlas package, and the code relies on `topojson.feature` to extract geographic features and `topojson.mesh` for boundary calculations.

Ddivyagunuguntla

76% match

Loading thumbnail…

homework 9

This visualization displays a zoomable map of the United States with OpenStreetMap tiles as the basemap, overlaid with red state boundaries. The map uses the d3-tile library to load and render raster tiles, while d3.geoMercator and d3.geoPath project the TopoJSON boundaries of US states from external JSON data. User interactions via d3.zoom adjust the tile scale and translate the projection to sync vector features with the changing raster view.

AAnaMal08

75% match

Loading thumbnail…

zoomUsCounty

This interactive map displays all U.S. counties as gray polygons with state borders overlaid in white. Clicking a state zooms in on that region, while clicking a county triggers a deeper zoom to a scale of 23, with another click resetting the view. The visualization uses D3 v3 and TopoJSON to load geographic data from a gist, projecting it with `d3.geo.albersUsa` and rendering paths via `d3.geo.path`. Transitions animate the zoom using SVG transform scaling and translation, with hover effects highlighting counties and states in orange.

JJn1532

75% match

Loading thumbnail…

Let's make a map of US-counties with D3.js:"hover and county name "

This example displays an interactive map of U.S. counties rendered as SVG paths, with each county’s name appearing as a tooltip on hover. The map uses the `geoAlbersUsa` projection and `geoPath` from D3 v5, while TopoJSON’s `feature` method extracts county geometries from the us-atlas counties-10m.json dataset. Hovering highlights the county in green via a CSS `:hover` rule. The visualization depends on D3’s `select` and `json` utilities to fetch and bind the geographic data.

NNita

74% match