Harsh Vijay

@harshvj03·6 public vizzes

Fork of Hello HTML

This example presents a minimal, nearly empty HTML page titled “Fork of Hello HTML,” consisting solely of a document skeleton with no visible content or interactive elements. It serves as a starting point for building web-based visualizations. The page relies on standard HTML structure without any additional libraries, such as D3.js or Canvas APIs, or data sources. The included README references a YouTube video, but the rendered page itself shows no data, charts, or JavaScript behavior.

Apr 4, 2022

Loading thumbnail…

Fork of Pathetic Bar Chart

This visualization displays the top 10 most populous countries from the United Nations World Population Prospects 2019 dataset as a horizontal bar chart. Each country is represented by a rectangle whose width corresponds to its 2020 population. The code uses React hooks (useState, useEffect, useCallback) to fetch and process the CSV data, while d3's scaleBand and scaleLinear handle the positioning and scaling. The chart renders as SVG, with React generating the rectangle elements directly from the mapped data.

May 27, 2021

Loading thumbnail…

Fork of Vega-Lite API Template

This scatter plot visualizes the relationship between engine displacement and horsepower for a collection of automobiles, using data loaded from a remote CSV file. Each point represents a car model, with tooltips revealing the vehicle's name on hover. The visualization is built using the Vega-Lite API, which constructs a specification rendered through the Vega and Vega-Lite libraries. Data is fetched asynchronously using d3.csv, and the chart configures axis styles and dark guide labels for a polished appearance.

May 26, 2021

Loading thumbnail…

Fork of Smiley Face Part II

This example displays a single yellow circle on a gray background, rendered as an SVG element. The circle is positioned at the center of a 960 by 500 canvas using React’s declarative syntax. The code defines the circle’s coordinates and radius as JavaScript variables, then passes them to an SVG `<circle>` element within a React component. The visualization is built with React 16.9 and ReactDOM, which render the SVG directly into the HTML page.

May 24, 2021

Loading thumbnail…

Fork of Smiley face part I

This example renders a static smiley face using React and SVG. The face consists of a yellow circle with a black stroke, and two smaller black circles for eyes, positioned within an 960×500 SVG canvas. The code imports React from the UMD build and logs it to the console, while the HTML file loads the React library from unpkg and includes the SVG markup directly. The visualization demonstrates basic SVG shape composition without any interactivity or dynamic behavior.

May 19, 2021

Loading thumbnail…

Smiley face part I

A yellow circle with a black outline forms a simple smiley face, and two smaller unfilled circles serve as eyes. No mouth is rendered. The visualization is built with React 17 and renders directly as static SVG markup in the HTML body, using hard-coded `circle` elements with fixed `cx`, `cy`, and `r` attributes. The example loads React from a UMD bundle and logs the React object to the console via `index.js`.

May 19, 2021