Oleksii

@oleksii-kononykhin·3 public vizzes

Fork of Rendering Data with React & D3

This example displays a radial burst visualization of CSS named colors, where each color is represented as a slice of a pie chart. The React app loads color data from a CSV file using D3’s `csv` utility, then renders the chart as SVG paths via React. Using D3’s `pie` function to compute arc angles and `arc` to generate path data, each slice’s fill is set from the `RGB hex value` column. The visualization is rendered entirely through React’s declarative component model, with D3 v5 providing data parsing and geometric calculations.

Aug 16, 2021

Loading thumbnail…

Fork of Smiley Face Part II

A smiley face is rendered as a full-screen SVG graphic using React components and D3's arc generator. The face is centered within the viewport with dimensions derived from the browser window, featuring a yellow circular head, two offset black eyes, and a curved mouth. The code leverages `d3.arc` to construct the mouth path with specified inner and outer radii and angular ranges. React manages the SVG elements, while D3 version 7 supplies the arc geometry, producing a static, responsive illustration.

Aug 12, 2021

Loading thumbnail…

Fork of Hello HTML

This example shows a simple, static SVG composition: a large yellow circle with a black outline and two smaller black circles, arranged to resemble a face. The code is a minimal HTML document that uses inline SVG elements to define the shapes directly, with the `circle` tag specifying center coordinates, radius, fill, and stroke properties. The page sets its body margin to zero and hides overflow, allowing the 960 by 500 pixel SVG canvas to occupy the full viewport without scrollbars. The visualization relies on plain SVG markup rather than any external JavaScript libraries or data processing.

Aug 12, 2021