geethakanniah

@geethakanniah·4 public vizzes

Fork of Loading and Parsing CSV Data

This example demonstrates loading and parsing CSV data by displaying a summary of the CSS Named Colors dataset in an HTML <pre> element. The code uses d3.csv from D3 v5 to fetch the remote CSV file, then calculates and displays the file size in kilobytes, row count, and column count. A commented-out alternative shows the same result using the Fetch API with async/await and d3.csvParse, illustrating two different approaches to handling asynchronous data loading in a React context.

Apr 3, 2021

Loading thumbnail…

Load and Parse CSV Data

This example demonstrates loading and parsing CSV data from a remote URL. It fetches a text file containing named CSS colors using the Fetch API and outputs the raw contents to the browser console. The code uses the asynchronous `fetch` function with `response.text()` to retrieve the data, and the URL points to a GitHub Gist hosted by the author. No parsing or visualization is performed; the example focuses solely on the initial step of retrieving CSV text.

Mar 19, 2021

Loading thumbnail…

Fork of Hello HTML

This example renders a stylized cartoon face using React components for each facial feature, composed within an SVG container. The face includes a radially gradient-filled background circle, two symmetrical eyes, and a mouth drawn with a d3.arc path. All geometry—circle positions, radii, and stroke widths—is defined as variables in the main App component and passed down as props. The rendering uses SVG elements with a radial gradient defined in a defs block, while React manages the component hierarchy and prop flow.

Mar 18, 2021

Loading thumbnail…

Hello HTML

This example draws a smiley face as an SVG graphic using React and D3.js. A radial gradient fills the main circle, while two solid yellow circles serve as eyes, positioned with offset coordinates. D3's `arc` generator creates the mouth as an SVG path, and the entire face is translated to the center of the viewport.

Mar 18, 2021