Skip to main content
SimilarExport ZIP
100%

Parse socioeconmic_data_states_2019-2010.csv

✓ Published0🌍 Public
PPeter Cordone
Last edited Sep 29, 2021
Created on Sep 7, 2021

This example parses a US Census socioeconomic dataset covering states from 2010 to 2019, displaying basic file statistics such as size in kilobytes, row count, and column count. It shows how to load and inspect a CSV file using `d3.csv`, then formats the results into a text message rendered in a large `<pre>` element. The code also includes commented alternatives using `fetch` with `async`/`await` and `d3.csvParse` for comparison. The data source is a remote CSV file hosted on GitHub Gist, containing quantitative census attributes like employment, occupation, industry, and poverty rates.

AI-generated description

What is the correlation between occupation, industry and people who live below the poverty level? What does that correlation look like by state?

Attributes that are interesting are: I extracted this data from the US Census web site (thanks to the book F. Donnelly, Exploring the U.S. census: your guide to America’s data. Los Angeles: SAGE, 2020). I've been wanting to learn to navigate the US Census data and web site (no small task) and this assignment gave the reason to do so!

There is quite a bit of data in the census extracts and I paired it down

  • Year is a categorical attribute and the year for the row
  • id is the census geoid for the state and is categorical
  • the rest of the attributes are quantitative. The columns quantify the population count of the state that for the columns category. The main areas are EMPLOYMENT STATUS, OCCUPATION, INDUSTRY and INCOME AND BENEFITS and the column header contains the corresponding text. The suffix text describes the category the count is for. The two columns at the end are the percentage of families below the poverty line.

Socioeconomic data extract from US Census 2019-2010 American Community Survey

MIT Licensed

Similar vizzes

Loading thumbnail…

Loading and Parsing CSV Data

This example demonstrates how to load and parse CSV data using D3 v5. It fetches the FreeCodeCamp GDP dataset, converts it to a string, and displays summary statistics including file size in kilobytes, number of rows, and column count. The code uses both `d3.json` with callback syntax and commented alternatives featuring `fetch`, async/await, and `d3.csvParse`. The rendered output appears as large text in a `<pre>` element, highlighting the data parsing process without any visualization.

SSeanCline213
77% match
Loading thumbnail…

2019 Index of Economic Freedom

This example displays summary statistics for the 2019 Index of Economic Freedom dataset, showing file size in kilobytes, row count, and column count. The code loads a CSV file from a GitHub gist using `d3.csv` and formats the parsed data with `d3.csvFormat` to calculate the size. It then updates the text content of an HTML `<pre>` element to present the metrics. The example demonstrates basic data loading and parsing with D3 v5, with commented alternatives using `fetch`, `async/await`, and `d3.csvParse`.

Hhotdoujiang
76% match
Loading thumbnail…

Loading and Parsing CSV Data

This example demonstrates how to load and parse CSV data using D3 v5, displaying file size, row count, and column count in a large pre-formatted text element. The code uses `d3.csv()` to fetch and parse the dataset from a GitHub-hosted CSV file containing NYC social media usage data, then formats the statistics with `d3.csvFormat()` to calculate kilobyte size. An alternative commented-out approach uses the Fetch API with `async`/`await` and `d3.csvParse()` for manual parsing. The example concisely shows the core workflow of retrieving and inspecting tabular data in a browser environment.

KKarenNg
75% match
Loading thumbnail…

Loading and Parsing CSV Data

This example demonstrates how to load and parse CSV data using D3 v5, displaying file size, row count, and column count in a large pre-formatted text element. The code uses `d3.csv()` to fetch and parse the dataset from a GitHub-hosted CSV file containing NYC social media usage data, then formats the statistics with `d3.csvFormat()` to calculate kilobyte size. An alternative commented-out approach uses the Fetch API with `async`/`await` and `d3.csvParse()` for manual parsing. The example concisely shows the core workflow of retrieving and inspecting tabular data in a browser environment.

KKarenNg
75% match
Loading thumbnail…

The Low- to Moderate-Income (LMI) New York State (NYS) Census Population Analysis dataset

This example reads a CSV file of Low- to Moderate-Income New York State census population data from a GitHub gist and displays basic dataset statistics. Using `d3.tsv` to load the file and `d3.csvFormat` to calculate its size, the visualization reports the file’s kilobyte size, row count, and column count in large text. The code also includes commented alternatives using `fetch` with `async`/`await` and a nested promise chain, illustrating different methods for loading and parsing tabular data in D3 v5. The source dataset comes from the NYS open data portal.

Ssophburke
74% match
Loading thumbnail…

Parsing CSV Data with D3

This example demonstrates how D3 parses a remote CSV file and summarizes its contents. The page displays three statistics about the data: its approximate size in kilobytes, its row count, and its column count. The code uses `d3.csv()` to fetch and parse the dataset from a GitHub Gist, then `d3.csvFormat()` calculates the formatted string length. The resulting message is rendered inside a `<pre>` element with large font styling. The implementation relies solely on D3 v7 and native JavaScript promises, with commented alternatives using `fetch` and `async/await`.

AAman Singh
74% match
Loading thumbnail…

Loading and Parsing CSV Data

This example demonstrates how to load and parse a CSV file using D3 v7’s `d3.csv` method, then displays basic summary statistics about the dataset in a large `<pre>` element. The code fetches a remote CSV from a GitHub gist and reports its size in kilobytes, row count, and column count. It also includes commented‑out alternatives using the Fetch API and `d3.csvParse` for manual text handling. The page is a minimal HTML document with no other visual elements, focusing purely on the data‑loading and parsing workflow.

Gguptambergatech
73% match
Loading thumbnail…

D3 Parsing CSV Data

This example demonstrates how D3 can load and parse CSV data from a remote URL, then displays the dataset’s basic metrics—size in kilobytes, row count, and column count—as oversized text on a web page. It uses the `d3.csv` method to fetch and parse the file asynchronously, and also includes commented-out code showing alternative parsing with `d3.csvParse` on raw text. The data source is a gist-hosted file containing CSS named colors. The page’s minimal styling relies on a large `pre` element for output.

KKazSoftwareEngineer
73% match