Skip to main content
SimilarExport ZIP
100%

Fork of Texas State Map

✓ Published1🌍 Public
NNita
Last edited Mar 26, 2025
Created on Mar 26, 2025
Forked from Texas State Map

A Texas state map displays county boundaries colored with a sequential green scale plus overlaid ZIP code outlines. Hovering reveals county FIPS codes and ZIP code names. The visualization uses d3.geoMercator, d3.geoPath, and topojson to render US Census Bureau state and county data, with ZIP codes from an ArcGIS REST service. A file input button allows uploading custom GeoJSON or TopoJSON data.

AI-generated description

Texas Map with ZIP Codes

This interactive visualization displays a map of Texas with both county boundaries and ZIP code information.

Features

  • Interactive map showing all Texas counties
  • ZIP code boundaries overlaid on the map
  • Major cities highlighted with labels
  • Hover over counties or ZIP codes to see more information
  • Upload custom ZIP code data if needed

Usage

  1. Open the index.html file in a web browser
  2. Hover over counties to see their FIPS codes
  3. Hover over ZIP codes to see their code and associated city/region
  4. To upload your own ZIP code data, click the button at the bottom and select a GeoJSON or TopoJSON file

Data Sources

  • Counties and state boundaries: US Census Bureau (via D3's us-atlas)
  • ZIP codes: ArcGIS REST service with Texas ZIP code boundaries
  • Custom ZIP code data can be uploaded in GeoJSON or TopoJSON format

Technical Details

This visualization uses:

  • D3.js for data visualization and mapping
  • TopoJSON for efficient map geometry representation
  • File API for custom data uploads
  • Mercator projection optimized for Texas

Browser Compatibility

This map works best in modern browsers including:

  • Chrome (recommended)
  • Firefox
  • Edge
  • Safari
MIT Licensed

Similar vizzes

Loading thumbnail…

Texas State Map

This interactive D3.js map displays the state of Texas with its county boundaries, major city markers, and labels. Built with D3 v7 and TopoJSON, it uses d3.geoMercator and d3.geoPath to project geographic data from the US-Atlas TopoJSON files. The map renders as SVG, with county paths colored sequentially using d3.scaleSequential and d3.interpolateGreens, while hover effects and tooltips reveal county FIPS codes.

NNita
84% match
Loading thumbnail…

Texas State Map With Zip Codes

This interactive map of Texas displays counties, ZIP code boundaries, and major cities with pan, zoom, and layer-toggle controls. Built with D3.js v7 and TopoJSON, it renders geographic data through the `d3.geoPath` projection and supports custom GeoJSON/TopoJSON ZIP code uploads. Animated loading indicators and hover tooltips enhance the experience. Data sources include the US Atlas TopoJSON for state and county boundaries, plus OpenDataDE ZIP code collections.

NNita
80% match
Loading thumbnail…

Fork of map

This visualization displays a map of the United States, with each county filled using a categorical color scale based on its name. It renders these counties as SVG paths generated by `d3.geoPath` with the `geoAlbersUsa` projection, sourcing geographic data from a US Atlas TopoJSON file. The counties are outlined in red with low opacity, and they highlight yellow on hover. The visualization uses D3 v5 and the `topojson` library’s `feature` function to extract the geometries from the `counties-10m.json` dataset.

Rreddysushma994@gmail.com
75% match
Loading thumbnail…

Fork of usa map

This map of the United States renders each state as an SVG path, colored by a categorical color scale based on the state name. The visualization uses the D3.js library's `geoPath` and `geoAlbersUsa` projection to convert TopoJSON state boundaries into map geometry. A hover effect turns the state black via CSS. The state boundaries are sourced from a remote JSON file containing US states data.

GGeorge Vaz
75% match
Loading thumbnail…

Fork of Fork of FP: Map

This example displays a map of the United States, rendering state boundaries with thin white strokes against a graticule grid and a bold black outline. It uses `d3.geoPath` with `d3.geoAlbers` to project and draw geographic features, and `d3.geoGraticule` to generate the background grid. State data is fetched from the `us-atlas` package as TopoJSON and converted to GeoJSON features via `topojson.feature`.

Rreddysushma994@gmail.com
74% match
Loading thumbnail…

Fork of usa map

This example displays a map of US counties, colored with a categorical color scale and outlined in red. It renders an SVG using a TopoJSON file from the `us-atlas` package, projecting the features with a `geoAlbersUsa` projection. The code employs d3's `geoPath` to generate the map paths and `scaleOrdinal` for coloring each county by name. Hovering turns a county yellow, and the data source is a remote JSON file loaded via d3's `json` loader.

Rreddysushma994@gmail.com
74% match
Loading thumbnail…

Fork of FP: Map

This visualization displays a map of United States states using an Albers projection, rendered as simple outlined polygons against a graticule grid. The code fetches TopoJSON data from the us-atlas package and converts it to GeoJSON using `topojson.feature`. It draws the map with `d3.geoPath`, also rendering the graticule and its outline via `geoGraticule`. The map appears once data finishes loading, with states shown as white-bordered paths on a plain background.

Rrobertotienonyaranga@gmail.com
74% match
Loading thumbnail…

USA Map Visualization

This example displays a map of Texas, colored according to a sample state population dataset. The code uses D3.js v6 with an SVG rendering approach. It loads GeoJSON map data from a local TX.geo.json file and applies a `d3.geoAlbersUsa` projection with `d3.geoPath` to draw the state boundary. A sequential red color scale (via `d3.scaleSequential` and `d3.interpolateReds`) maps population values to fill colors. States not found in the dataset appear light gray.

BBhavanaGIrni
74% match