tssytrack

@tssytrack·4 public vizzes

Fork of Let's Make a Face Part I

A simple SVG face made of three circles sits centered on a yellow background. The code draws a large yellow circle with a black stroke for the head, then places two smaller black circles as eyes at fixed coordinates. This example uses raw SVG elements—`circle` tags with explicit `cx`, `cy`, `r`, and `fill` attributes—without any JavaScript libraries or data binding. The rendering is static, with all geometry hardcoded in the HTML, and the page hides scrollbars via CSS.

Apr 13, 2022

Loading thumbnail…

Smily face part1

A yellow circle with a black stroke forms the head of a smiley face, while two smaller black circles serve as eyes. The example demonstrates basic SVG circle elements rendered inside a React application, using hardcoded coordinates rather than data-driven values. The code imports React and ReactDOM but does not yet attach the component to the DOM, leaving the visualization static. The rendering approach relies on plain SVG markup directly in the HTML, with no interactive behavior or animation present.

Mar 17, 2021

Loading thumbnail…

Cars Report

This example displays a single car make, “Honda,” pulled from a hardcoded JSON array of five vehicle entries (year, make, model, price) defined in `cars.js` and parsed with `JSON.parse`. The code uses plain JavaScript to select an element by ID via `document.getElementById` and writes the text content to the page. No D3 version 6 APIs or visual elements are employed; the demonstration focuses on importing an ES module and manipulating the DOM directly.

Feb 12, 2021

Loading thumbnail…

Test

This example demonstrates a minimal HTML page that outputs the text "Hello HTML" in large, centered type. It pairs static CSS styling with a small JavaScript snippet that logs "Hello JavaScript!" to the browser’s developer console, highlighting the separation between presentation and scripting. The code uses the Document Object Model’s `console.log` API and relies on plain CSS for layout. It serves as a bare-bones starting point for integrating JavaScript into a web page, with a linked React Starter example for further exploration.

Feb 12, 2021