Scott-Zeta

@Scott-Zeta·3 public vizzes

Fork of Sol LeWitt Reproduction

This is a generative visualization that reproduces a Sol LeWitt art piece by layering horizontal and vertical black-and-white stripes within a centered circular mask. The code uses the SVG API to create 100 horizontal rectangles and 100 vertical rectangles, each with a height or width of 10 pixels, and applies two distinct masks (`circle-mask` and `circle-mask-2`) to reveal the stripes only inside the circle. The first mask shows the horizontal bars, while the second mask inverts its effect to display the vertical bars, resulting in a crosshatched pattern over the entire viewport. The piece dynamically adapts to the browser window dimensions, with no external data source or libraries beyond the native DOM manipulation.

May 18, 2022

Loading thumbnail…

Fork of Let's Make a Face Part I

This visualization displays a static, yellow smiley face constructed from SVG shapes, positioned on a black-outlined circular face with two smaller circles for eyes. Rendered using React and ReactDOM, the face is built with three `<circle>` elements inside an SVG canvas, with the face centered at 480,250 and a radius of 245 pixels. The eye circles are placed at fixed offsets from the center, leaving the mouth unfinished, as noted in the README. The code references a video tutorial but does not implement interactive behavior.

Apr 27, 2022

Loading thumbnail…

Face HTML

This example shows a simple, static face rendered as a yellow circle with two black eye dots on a white background. The entire graphic is defined directly in an SVG element within an HTML page, using basic SVG circle elements for the head and eyes. The page uses no external JavaScript libraries; instead, it relies on inline SVG markup and minimal CSS to set the body margin and hide overflow. The data is hand-coded in the HTML, and the rendering approach is pure SVG, with a stroke width of ten for the face’s outline.

Apr 27, 2022