Skip to main content
SimilarExport ZIP
100%

south carolina counties

✓ Published0🌍 Public
Ooliverkendall99@gmail.com
Last edited May 1, 2024
Created on May 1, 2024
Forked from Circles

This example displays a map of South Carolina counties, coloring each county path either red or blue based on its state ID. It loads geographic data from a remote JSON file and uses TopoJSON to convert it into GeoJSON features for rendering. The visualization relies on D3’s `select` and `attr` methods to configure an SVG canvas, while `d3.geoPath` is used to generate the path data for each county shape. The code also demonstrates importing local ES6 modules and logging county geometry coordinates.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.
MIT Licensed

Similar vizzes

Loading thumbnail…

SC Counties2

This example displays a choropleth map of South Carolina counties, coloring each county blue or red based on whether its ID matches the value "06". It renders the GeoJSON data as SVG paths using D3's `geoPath()` projection. The code loads D3 via UNPKG, fetches geographic data from a raw GitHub GeoJSON URL, and demonstrates importing from local ES6 modules alongside D3's `select` API.

Ooliverkendall99@gmail.com
89% match
Loading thumbnail…

SC Counties

This example renders a choropleth map of US counties from TopoJSON data using D3 v5 and the `d3.geoPath` API. Each county is drawn as an SVG path, colored blue by default, with red highlighting for counties whose ID matches `'06'`, and tooltips via appended `title` elements. The map loads external US county geometry from a remote URL, while `topojson.feature` converts the data for rendering in an SVG container.

Ooliverkendall99@gmail.com
85% match
Loading thumbnail…

Fork of SC4

This map of South Carolina shows the number of grain elevators in each county via a diverging color scale from light yellow to dark red. Hovering over a county highlights it in dark blue and displays a tooltip with the county name and elevator count. The visualization loads D3 v6 from a CDN, uses `d3.geoMercator` and `d3.geoPath` to project and draw GeoJSON county boundaries, and joins that with CSV data. Interactivity relies on SVG path mouse events and a custom tooltip div managed through `d3.select`.

Bbepnye@gmail.com
76% match
Loading thumbnail…

SC4

This visualization shows the distribution of grain elevators across South Carolina counties, with each county shaded on a color scale from light yellow to dark red based on the number of elevators it contains. Hovering over a county highlights it in blue and displays a tooltip with the county name and elevator count. The map is rendered using SVG paths from a GeoJSON file, projected with `d3.geoMercator` and `d3.geoPath`, while elevator data is loaded from a CSV. The color scale uses `d3.scaleLinear` with `d3.extent` to set the domain, and tooltips are implemented as a D3 selection appended to the page.

Ooliverkendall99@gmail.com
76% match
Loading thumbnail…

Fork of WAEVData_Fork of Chloropleth

This fork visualizes South Carolina county boundaries using a Mercator projection, rendered via two side-by-side SVG canvases with each county filled in blue using `d3.geoPath`. The code loads GeoJSON map data from a GitHub repository alongside a CSV dataset, though the CSV is fetched but not directly used in the visible rendering. Built with D3.js v6 and React, the example demonstrates a static choropleth foundation, creating SVG paths for each geographic feature through `d3.json` and `d3.csv` promises.

Bbepnye@gmail.com
75% match
Loading thumbnail…

SC5

This visualization merges a choropleth map of South Carolina counties with a linked bar chart, using elevator permit data alongside demographic metrics (population, income, and poverty) from voting records. Users select a metric from a dropdown, which re-renders both the map and the bar chart, styled with a shared linear color scale applied via `d3.scaleLinear`. Hovering over any county on either view triggers a tooltip (via `d3.select` and `getBoundingClientRect`) showing the county’s elevator count and the selected metric. The map uses `d3.geoMercator` with `d3.geoPath` for projection and county outlines, while the bar chart is built with `d3.scaleBand` and `d3.axisLeft`.

Ooliverkendall99@gmail.com
75% match
Loading thumbnail…

Country Map

This example renders a choropleth-style map of United States counties on an SVG canvas. Each county polygon is drawn as a purple path with white strokes, and hovered counties turn red, with the county name appearing as a tooltip. The visualization uses D3 v5’s `geoAlbersUsa` projection with `geoPath` to generate the shapes, and TopoJSON’s `feature` method to parse county boundaries from the us-atlas dataset. County names come from the TopoJSON properties, while the map loads via a remote JSON URL.

AAashish Pandey
74% match
Loading thumbnail…

s map

This map of Swedish counties visualizes administrative boundaries using a geoMercator projection fitted to the extent of the geographic features. Built with React and D3 v5, the code loads TopoJSON data from a GitHub gist and converts it to GeoJSON using `topojson.feature` and `topojson.mesh`. The `d3.geoPath` generator renders both county outlines (`feature`) and interior borders, with styling defined in CSS that fills each county in teal and strokes boundaries in contrasting colors. The visualization presents the simplified county geometry as an interactive SVG graphic.

SSaahithi49
74% match