alexfox

@alexfox·3 public vizzes

Fork of HTML Starter

This example demonstrates a minimal React application that fetches a CSV file from a GitHub Gist using D3’s `csv` method. The fetched data is stored in React state via the `useState` and `useEffect` hooks, and the app displays a message showing the approximate size of the formatted CSV data in kilobytes. The code uses React DOM to render the component into the page, and D3 v7 provides the CSV parsing functionality. A large `pre` element styles the output text prominently.

Jul 16, 2021

Loading thumbnail…

Fork of HTML Starter-2

This example demonstrates fetching a CSV file and logging its contents to the browser console. It uses the JavaScript `fetch` API within an async function to retrieve a color dataset from a GitHub Gist URL, then converts the response to text with `response.text()`. The code shows both a modern async/await approach and a commented-out promise-chain alternative. No data visualization is rendered; the focus is on establishing a data-loading pattern for a future visual.

Jul 16, 2021

Loading thumbnail…

Fork of HTML Starter

A grid of identical cartoon faces is rendered using React components and SVG. Each face uses the D3 `arc` generator to create a mouth, while other facial features are composed from separate React components for circles. The faces are generated from a D3 `range` array, with all SVG elements grouped and positioned via a transform. The example uses React 17, D3 v7, and an SVG rendering approach within an HTML page.

Jul 15, 2021