Skip to main content
SimilarExport ZIP
100%

Lab4 carita feliz

✓ Published0🌍 Public
Llimeroc
Last edited May 17, 2021
Created on May 17, 2021

A smiley face rendered in purple with black outlines, drawn on an SVG canvas. The face is constructed with a large circle for the head, two smaller circles for eyes, and a path-based mouth using an arc. D3.js v5 is used for DOM element selection and creation, with the `select` and `append` APIs. The mouth is generated using `d3.arc` to define the path's shape, while eye and eyebrow positions are set via simple coordinate translations.

AI-generated description

Demonstrates fundamental DOM manipulation using D3.js by making a smiley face whose eyebrows move.

MIT Licensed

Similar vizzes

Loading thumbnail…

1 - Carita feliz

A yellow smiley face rendered as an SVG using React and D3.js. The face consists of a yellow circle with a black stroke, two black eyes, and a mouth drawn as an arc path. The D3 `arc` API generates the mouth’s curved geometry with specified inner and outer radii and angular start and end points. The composition is centered within a 960 by 500 viewport using a transformed coordinate system, with all elements positioned relative to that center point.

JJuan Martin Ludueña
83% match
Loading thumbnail…

Lab06, Happy Face :)

A smiley face appears as a light blue circle with black outlines, featuring two eyes, rectangular eyebrows, and an arc-shaped mouth. The example demonstrates fundamental DOM manipulation in D3.js v5, using `select` and `append` to build the SVG structure. The eyebrows animate by chaining `transition().duration(2000)` calls, moving them down and back up. Rendering uses an SVG canvas with coordinate transformations via `attr('transform')`, and the mouth is drawn using the `arc` shape generator.

DDiego-Vargas
82% match
Loading thumbnail…

Lab06, Happy Face :)

A smiley face appears as a light blue circle with black outlines, featuring two eyes, rectangular eyebrows, and an arc-shaped mouth. The example demonstrates fundamental DOM manipulation in D3.js v5, using `select` and `append` to build the SVG structure. The eyebrows animate by chaining `transition().duration(2000)` calls, moving them down and back up. Rendering uses an SVG canvas with coordinate transformations via `attr('transform')`, and the mouth is drawn using the `arc` shape generator.

DDiego-Vargas
82% match
Loading thumbnail…

Carita Feliz Parte 1

A smiling face is drawn as a yellow circle with black strokes, two solid black eyes, and a mouth arc, all centered on a gray background. The visualization is built with React and D3 v7, using SVG for rendering. The code defines geometric constants for dimensions and uses D3's `arc()` generator to create the mouth path and `line()` (imported but unused) for potential shapes. The face is positioned via a translated group at the center of the canvas.

Ddiegoadum
81% match
Loading thumbnail…

smile 2

A smiling face is drawn on an SVG canvas using D3.js version 6, featuring a yellow circle head, two black circular eyes, and a separate arc path for the mouth. The code creates the head and eyes through explicit `append('circle')` calls with positioned `cx` and `cy` attributes, while the smile uses the `d3.arc()` generator to compute path data from angular and radial parameters. All shapes render as SVG elements within a 600×400 pixel viewport, demonstrating basic geometric construction with D3 selection and attribute methods.

AAya
80% match
Loading thumbnail…

HTML Cars report

This visualization displays a cheerful yellow smiley face rendered as an SVG graphic. The face includes a circular head, two black eyes, and a curved mouth created using D3's arc generator. The code builds the composition using D3 v7 selections and shape primitives, with the SVG canvas set to 1000 by 1000 pixels. The smiley is centered via a group translation, while the mouth and left eyebrow are drawn using the `d3.arc()` path generator with specified angles.

SSampras Dsouza
80% match
Loading thumbnail…

D3.js - Smiley Face

A yellow smiley face drawn entirely with SVG elements, including circles for the face and eyes, rectangles for eyebrows, and an arc-generated path for the mouth. The face is centered within a 960×500 SVG canvas using D3.js selections and transformations. Constructed with the `select` and `arc` APIs from d3.v6, the code demonstrates manual positioning through `translate` attributes rather than data binding. The static visualization uses no external data source, relying instead on fixed dimensions and offsets defined as constants.

FFaris Sufyan
79% match
Loading thumbnail…

Smiley face

A yellow smiley face with black eyes, eyebrows, and an arc-shaped mouth is drawn in the center of an SVG canvas using D3.js v6. The face is constructed with D3 selections and shape generators, including `d3.arc` for the mouth and appended SVG `circle` and `rect` elements. A brief animation occurs when the eyes transition their fill color to black after a one-second delay. The graphic is rendered as static SVG with a simple transition effect.

AArun
79% match