NajamQ

@NajamQ·3 public vizzes

D3 Scatter Plot Najam

This example visualizes the classic Iris dataset as a scatter plot, mapping petal length on the x-axis against sepal length on the y-axis. It loads the CSV data from a GitHub gist, parses the numeric fields, and renders each flower as a small circle. The code uses d3.csv, d3.scaleLinear, and d3.extent to compute scales, then joins data to SVG circles and adds axes with d3.axisLeft and d3.axisBottom. The visualization fills the browser window using window.innerWidth and innerHeight, with margins applied to the plot area.

Sep 24, 2023

Loading thumbnail…

Smiley Face Part 1

A grid of 18 smiley faces, each a yellow SVG circle with black stroke, displays randomized eye and mouth sizes. Using React components for the face structure and D3’s arc generator to draw the smile, the faces are rendered in an SVG container. The code varies eye radius, mouth width, and mouth radius via `Math.random()` within each face's props.

Aug 20, 2023

Loading thumbnail…

Fork of HTML Starter - Najam

This example demonstrates a simple web page that displays the text “Hello Najam” in large, centered type. The page uses plain HTML with embedded CSS to style the message, setting the font size to 13em and aligning it to the center. JavaScript is not actively used in this static rendering; the page relies solely on HTML and CSS for its visual output. The minimal structure serves as a basic starter template for experimenting with web technologies.

Jul 19, 2023