Starbucks Locations

100%

Starbucks Locations

✓ Published0🌍 Public

Last edited Nov 7, 2018

Created on Oct 25, 2018

This example maps Starbucks locations across the United States using an SVG map rendered with D3’s `geoAlbersUsa` projection and `geoPath` to draw state outlines from TopoJSON data. Each store is plotted as a small red circle based on its longitude and latitude, with hover tooltips displaying the location name. The map supports zoom and pan via D3’s zoom behavior, and the dataset is loaded from a CSV file.

AI-generated description

Starbucks Locations across US source: https://gist.github.com/dankohn/09e5446feb4a8faea24f#file-starbucks_us_locations-csv

Dataset contains 3 columns: location address, longitude and latitude info.

MIT Licensed

Similar vizzes

Loading thumbnail…

Gist 1e86c34932980874eb5f

This animated SVG visualization maps the distribution of Starbucks and Dunkin' Donuts locations across U.S. states, using a circular adjacency matrix to compare the two coffee chains. Each state is represented along both axes, with colored cells encoding store counts for each brand. The visualization highlights regional differences in coffee chain dominance, with Dunkin' Donuts concentrated in the Northeast and Starbucks stronger in the West and South. Animated transitions help draw attention to the highest-density pairs, making it easy to compare the relative presence of each company across different states at a glance.

11wheel

74% match

Loading thumbnail…

Project in progress

This example shows a geographic map of the contiguous United States with red dots representing fast food restaurant locations, filtered to include only coordinates within the lower 48 states and Hawaii. The map is rendered using SVG with the d3.geoAlbersUsa projection and d3.geoPath, while restaurant data is loaded from a CSV file and plotted as circles. The visualization supports zooming and panning through d3.zoom, and states change color on hover via CSS.

Jjons288

73% match

Loading thumbnail…

country map

This example displays a map of the United States with state boundaries, rendered as SVG paths using D3’s `geoAlbers` projection and `geoPath`. It shows land areas in blue, a graticule sphere in purple, and state interiors highlighted with yellow strokes. The map loads US Atlas TopoJSON data from jsdelivr, processes it with `topojson.feature` and `topojson.mesh`, and is built within a React component using the `geoGraticule` API to draw the graticule lines.

PPavaniMangugari

72% match

Loading thumbnail…

Country Map

This example visualizes a map of the United States, rendering individual state boundaries as green paths with dark strokes on a light blue SVG canvas. It uses the D3 v4 library with `d3.geoPath` and the `d3.geoAlbersUsa` projection to draw the map, while `topojson-client` converts TopoJSON data from the us-atlas dataset into GeoJSON features. The SVG is styled with a custom background color and positioned within a React-free HTML page, with margins and transform attributes controlling the layout.

Ssudeepmamidi

72% match

Loading thumbnail…

Country map

This example displays a map of the United States with state boundaries rendered as SVG paths. Using D3’s `geoPath` and the `geoAlbersUsaTerritories` projection, it draws land areas in burlywood and state interior borders in teal. Geographic data comes from the `us-atlas` TopoJSON file, processed with `feature` and `mesh` from TopoJSON. The React component structure uses hooks (`useState`, `useEffect`) via `useData` to load and pass the map data to the `Marks` component.

SSaiSree0122

71% match

Loading thumbnail…

USA Country Map with Topojson data

This example displays a choropleth-style map of the United States, with each state rendered as a separate SVG path using a topojson dataset. It shows state boundaries and names via tooltips. The code uses D3 v5’s `geoAlbersUsa` projection and `geoPath` to generate the paths, while `topojson.feature` converts the TopoJSON topology into GeoJSON features. The map is drawn with SVG elements, and the data is loaded asynchronously from a GitHub gist using D3’s `json` method.

NNaveenrajaYalagandula

71% match

Loading thumbnail…

Project in progress - WEEK 2

This example displays a map of the United States with red points marking fast food restaurant locations, overlaid on a state boundary layer. The map supports zooming and panning, and states highlight on hover. It uses D3 v5 with `d3.geoAlbersUsa` for projection, `d3.geoPath` to render TopoJSON state outlines, and `d3.zoom` for interaction. Restaurant coordinates are loaded from a CSV file and plotted as SVG circles.

NNTCHANG1289

71% match

Loading thumbnail…

sreekar_Country_Map

This example displays a choropleth-style map of the United States with state boundaries and graticules, rendered as SVG via React components. It uses D3 v5’s `geoAlbers` projection and `geoPath` to draw land and interior borders, while loading TopoJSON data from the US Atlas. The map applies a purple land fill on a black sphere, with white interior strokes, styled through CSS classes. Data loading occurs asynchronously via `json()` and is processed with topojson’s `feature` and `mesh` functions.

SSreekarveeravelly

71% match