Skip to main content
SimilarExport ZIP
100%

Fork of Let's Make a Face Part I

✓ Published0🌍 Public
KKrishna2752
Last edited Jul 20, 2021
Created on Jul 20, 2021

This visualization shows a simple smiley face built from three SVG circles: a large yellow face with a black outline and two smaller empty circles for eyes. The code uses plain SVG elements rendered inline in an HTML document, with the `circle` tag for each shape. It runs on D3.js version 3, though no D3-specific API calls appear—just static SVG markup. The face is centered on a 960x500 canvas, with the face positioned at (480, 250) and eyes at (360, 220) and (600, 220). The example demonstrates basic geometric composition without interactivity or animation.

AI-generated description

Half way towards a smiley face.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Let's Make a Face Part I

This example shows a simple smiley face constructed from three SVG circles: a large yellow head and two smaller eyes. The face is centered in an SVG canvas, drawn with a black stroke. The code uses basic SVG elements (`circle` tags) within a manually authored `svg` markup, with inline styling for body margins and overflow. No JavaScript libraries or data sources are involved; the visualization is purely declarative HTML/SVG, as seen in the static `index.html` file.

Oognyvrac
95% match
Loading thumbnail…

Fork of Let's Make a Face Part I

This example shows a simple, static smiley face created with basic SVG shapes. The code draws a large yellow circle with a black stroke for the head, and two smaller black circles for the eyes, all placed within an SVG element. It does not use any JavaScript libraries, relying instead on the D3.js version 3's underlying SVG support, but the data visualization is purely declarative HTML. The entire composition is centered on an 960x500 canvas, with explicit coordinates for the head and eye positions.

AArvind Chauhan
95% match
Loading thumbnail…

Fork of Let's Make a Face Part I

This example shows a simple smiley face built from three SVG circles: one large yellow circle for the head and two smaller black circles for the eyes. The code uses raw SVG elements with explicit `cx`, `cy`, and `r` attributes, along with inline styling for the fill and stroke colors. The face is centered on a 960 by 500 viewport, with the head positioned at the middle and the eyes offset horizontally. No additional JavaScript libraries are used; the visualization relies entirely on static SVG markup rendered directly in the browser.

PPratyushSn
95% match
Loading thumbnail…

Fork of Let's Make a Face Part I

This visualization shows a simplified smiley face constructed from three SVG circles: a large yellow head with a black stroke, and two smaller black circles for eyes. The SVG canvas is 960 by 500 pixels, with the head centered and the eyes offset horizontally. The code uses inline SVG elements and CSS to hide the page scrollbars, rendering the face directly in the browser without any JavaScript libraries or data sources.

HHarshinireddyy19
95% match
Loading thumbnail…

Fork of Let's Make a Face Part I

This visualization shows a simplified smiley face constructed from three SVG circles: a large yellow head with a black stroke, and two smaller black circles for eyes. The SVG canvas is 960 by 500 pixels, with the head centered and the eyes offset horizontally. The code uses inline SVG elements and CSS to hide the page scrollbars, rendering the face directly in the browser without any JavaScript libraries or data sources.

HHarshinireddyy19
95% match
Loading thumbnail…

Fork of Let's Make a Face Part I

This example shows a simple smiley face built from three SVG circles on a yellow background. The face is centered in a 960 by 500 pixel canvas, with two eye circles positioned symmetrically around the center. The code directly uses the SVG API for rendering, setting circle attributes like `cx`, `cy`, `r`, `fill`, and `stroke` inline within the HTML. No external JavaScript libraries are used; the visualization is purely static, with all geometry and styling defined in the markup. The face appears as a basic, fixed illustration without animation or interaction.

NNdip Estaban
95% match
Loading thumbnail…

Fork of Let's Make a Face Part I

This example shows a static smiley face built from three SVG circles: a large yellow head with a black outline and two smaller black eyes. The head is centered at (480, 250) with a radius of 245, while the eyes are positioned at (350, 180) and (600, 180) with a radius of 50. The code uses raw SVG elements—`circle` tags with attributes for position, fill, stroke, and stroke-width—rather than a library like D3. The page is styled with minimal CSS to remove margins and hide overflow, and the face represents “halfway” progress toward a more complex face.

RRoshan Kumar
95% match
Loading thumbnail…

Fork of Let's Make a Face Part I

This example shows a static smiley face built from three SVG circles: a large yellow head with a black outline and two smaller black eyes. The head is centered at (480, 250) with a radius of 245, while the eyes are positioned at (350, 180) and (600, 180) with a radius of 50. The code uses raw SVG elements—`circle` tags with attributes for position, fill, stroke, and stroke-width—rather than a library like D3. The page is styled with minimal CSS to remove margins and hide overflow, and the face represents “halfway” progress toward a more complex face.

RRoshan Kumar
95% match