nth19912000

@nth19912000·4 public vizzes

Loading and Parsing CSV

This example demonstrates the initial steps of loading and parsing CSV data for visualization, with a video embedded for reference. The page fetches a remote JavaScript file containing CSV data from GitHub Gist using the Fetch API, and logs the response to the browser console. However, the code is incomplete—it does not actually parse the CSV or render any visualization, despite the title. The example uses native browser APIs (`fetch`, `console.log`) within a bare-bones HTML page, highlighting the starting point of a data-loading workflow.

Jan 13, 2022

Loading thumbnail…

Loading and Parsing CSV

This example demonstrates loading and parsing CSV data using D3 v7, rendering a static smiley face composed of SVG circles. The visualization shows a yellow circle with two black eyes and a black stroke, though it does not actually load or parse any external data despite the title. The code uses the `d3.min.js` library from unpkg, though it does not directly call any D3 APIs. Instead, it relies on raw SVG elements with hardcoded coordinates and dimensions within an 960x500 viewport. The smiley face omits a mouth, leaving the shape incomplete.

Jan 13, 2022

Loading thumbnail…

Fork of Smiley Face Part I

This fork of “Smiley Face Part I” is a static SVG drawing of a smiling face built directly in the markup. It shows a large yellow circle with a black outline, two solid black circles for eyes, and omits the mouth, leaving the expression incomplete. The visualization uses only plain SVG elements—`circle` and `svg`—positioned with explicit `cx`, `cy`, and `r` coordinates inside a 960-by-500 viewport. It loads the D3 v7 library via a CDN but does not apply any data binding or D3 methods, relying entirely on hardcoded shapes for its rendering.

Jan 13, 2022

Loading thumbnail…

Smiley Face Part I

A yellow circle forms the base of a smiley face, with two black circles representing eyes. The example demonstrates static SVG rendering with D3.js v7, using basic shape elements like `<circle>` and attributes for fill, stroke, and positioning. The code manually defines coordinates, with the face centered at (480, 250) and eyes placed symmetrically. No interactive or animated behavior is present; the visualization relies solely on declarative SVG markup within an HTML document.

Jan 13, 2022