Maz Hermon

@mazhermon·2 public vizzes

Fork of Smiley Face Part II

A small React app fetches a CSV of HTML color data with `d3.csv`, then computes and displays the file size, row count, and column count in a `<pre>` block. The summary text is generated by a separate `message.js` module that uses `d3.csvFormat` to measure the data’s size in kilobytes. While data loads, the interface shows "loading..." before React re-renders with the final statistics. The visualization is minimal, focusing on metadata rather than graphical output.

Jul 19, 2021

Loading thumbnail…

Loading and Parsing CSV Data

This example demonstrates how to load and parse CSV data using D3 v5 and the Fetch API, displaying file size, row count, and column count in a large text element. It fetches a CSV file of HTML color names from a GitHub gist, then parses the text with `d3.csvParse` to extract the data structure. The visualization is minimal—just a `pre` element showing summary statistics—but the code also includes commented alternatives using `d3.csv` and a "pyramid of doom" fetch pattern for comparison. It highlights modern async/await syntax for data loading in a React context.

Jul 18, 2021