Amol Tangade

@amolmt·4 public vizzes

Fork of React Starter

This example renders a simple yellow smiley face using React and SVG. It shows a large yellow circle with black stroke for the head, two offset black circles for eyes, and a ring-shaped path created with d3’s `arc` generator for the mouth. The `arc` defines inner and outer radii and a full 2π angle range. The SVG elements are constructed declaratively in a React component, with coordinates computed from fixed width and height constants.

Jul 31, 2021

Loading thumbnail…

Fork of Let's make a face with D3.js!

A yellow smiley face with animated eyebrows demonstrates core D3.js selection and transition methods. The code renders an SVG circle for the face, two smaller circles for eyes, rectangles for eyebrows, and an arc-generated path for the mouth. Using d3-transition, the eyebrow group moves up and down in a repeating two-second cycle. The example highlights how d3-selection chains element creation and attribute manipulation, while d3-arc constructs the curved mouth shape.

Jul 31, 2021

Loading thumbnail…

Hello World

This example demonstrates a minimal web page that displays an empty SVG element. The code uses plain HTML with a linked stylesheet and JavaScript, though no drawing or data visualization logic is included. The page structure is defined by standard HTML tags, with the SVG container ready for graphical content. It serves as a starting point for building interactive visualizations with CSS and JavaScript, referencing a React-based starter project for further exploration.

Jul 31, 2021

Loading thumbnail…

Fork of Let's make a face with D3.js

This example builds a cheerful cartoon face from SVG shapes—a yellow circle for the head, eyes, eyebrows, and a mouth drawn with `d3.arc()`. The eyebrows animate upward and back down via chained `transition().duration(2000)` calls. The code imports `select` and `arc` from the D3 v7 module, loads the library from UNPKG, and uses local ES6 modules to demonstrate VizHub's project structure.

Jul 31, 2021