Chirag Bansal

@bansalc73·3 public vizzes

Fork of Loading and Parsing CSV Data

This example demonstrates loading and parsing a CSV file containing CSS named colors, then displaying summary statistics about the dataset. The visualization presents a simple text message showing the file size in kilobytes, the number of columns, and the number of rows. The code uses the D3.js version 6 library, specifically the `d3.csv` method to fetch and parse the remote CSV data from a GitHub gist URL. After parsing, it calculates the file size using `d3.csvFormat` and outputs the results to both the console and the page body.

Jun 2, 2021

Loading thumbnail…

Fork of Let's Make a Face Part I

This example builds a simple smiley face using React and SVG, rendering a yellow circle with two black eyes. The face is drawn with three `<circle>` elements, where the head and eye positions are calculated from fixed width, height, and offset variables. The code uses ReactDOM to mount the component, and computes the head radius from the height minus a stroke width. It demonstrates basic SVG styling with fill, stroke, and positioning in a 960x500 viewport.

May 30, 2021

Loading thumbnail…

Smiley Face

This example shows a simple smiley face, drawn as three SVG circles on a 1000 by 1000 canvas. It uses React via the `react.production.min.js` script and raw SVG markup for rendering, with no external data source. The face is composed of a large yellow circle outlined in red for the head, and two smaller black circles with red strokes for the eyes. The layout is static and hard-coded, with circles positioned using explicit `cx`, `cy`, and `r` attributes.

May 30, 2021