Skip to main content
SimilarExport ZIP
100%

SC5

✓ Published2🌍 Public
Ooliverkendall99@gmail.com
Last edited Dec 9, 2024
Created on May 7, 2024
Forked from Fork of SC4

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`.

AI-generated description

This is my README: my project is going to look at elevator data in South Carolina and how it compares and informs development across the state. right now it runs just by running the project and hovering over each county.

Task: utilize elevator data with population data in order to gain an understainding in development in SC Counties.

TODO: -The future of the Viz will be accompanied by a stacked histogram with county information, population, income,etc... -incorporate an additional map of the state displaying other information to gain a more signifigant understandign of SC counties. -addition VIZ's to better understand SC counties -add a colorscale for the state VIZ as seen here -make popup menu when mouseing over a county more effective

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of SC5

This visualization combines a choropleth map of South Carolina counties with a horizontal bar chart, showing elevator counts and population data. Hovering over a county highlights it and displays a tooltip with the number of elevators and total population. The map uses a linear color scale, while the bar chart employs `d3.scaleBand` and `d3.axisBottom`. Data is loaded from external CSV and GeoJSON sources via `d3.csv` and `d3.json`, with interactions handled through D3 event listeners.

Bbepnye@gmail.com
91% 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
84% match
Loading thumbnail…

colorado data

This visualization maps elevator installations across South Carolina counties, coloring the map by a selected metric (population, income, or poverty). A bar chart displays the same metric per county, with tooltips revealing the elevator count for each. The code uses D3.js v6 with a Mercator projection (`d3.geoMercator`) and `d3.geoPath` to render the U.S. counties. The visualization reads from local data files and a dropdown menu (`#dataSelector`) dynamically re-renders both the map and the bar chart, using `d3.scaleLinear` for color mapping and `d3.scaleBand` for the chart axes.

Ooliverkendall99@gmail.com
82% 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
82% match
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
77% match
Loading thumbnail…

south carolina counties

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.

Ooliverkendall99@gmail.com
75% 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
73% 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
72% match