Skip to main content
SimilarExport ZIP
100%

Homework #1: Work in Progress

✓ Published0🌍 Public
JJCarpenter-WPI
Last edited Sep 18, 2019
Created on Aug 28, 2019

This example shows a simple smiley face rendered as an SVG graphic using React and D3. The face consists of a yellow circle with a black stroke, two black eyes, and a mouth drawn as an arc. The code uses React to create SVG elements and the `arc` function from d3-shape to generate the mouth path. The components are positioned using React JSX, with explicit dimensions and offsets defined in the script.

AI-generated description

This was the first step when I was working on the first homework.

MIT Licensed

Similar vizzes

Loading thumbnail…

Homework 1

This example renders a partial smiley face in a React-powered SVG canvas. The code uses D3’s `arc` function to draw a thick semi-circular mouth, with two dashed placeholder lines for eyes, all centered on a 960×500 coordinate system. The face is built programmatically using absolute coordinates and transformations, with an empty rectangle overlay. The visualization demonstrates basic geometric composition and D3’s arc path generation within a React component, though the final output is an incomplete facial sketch.

JJohel Durán Acuña
92% match
Loading thumbnail…

Homework #1: Another work in progress

A simple emoticon face rendered as a purple circle with black outlines, two eyes, and a mouth, drawn using React and SVG. The face is centered in a 960×500 viewport, with the mouth created by a d3.arc path and a thick black line. The code uses ReactDOM.render to mount the component, and d3’s arc helper to generate the mouth shape. No external data is used; all geometry is defined by fixed constants.

JJCarpenter-WPI
89% match
Loading thumbnail…

Homework #1: Work in Progress 2

A static SVG cartoon face is rendered in a purple circle with black outlines, featuring two offset eyes and a mouth drawn as an arc with a straight line beneath it. Built with React and D3 v5, the visualization uses D3’s `arc` generator to define the mouth’s path, while SVG primitives like `circle`, `line`, and `path` are composed inside a translated group. The layout is computed from fixed variables for dimensions and offsets, with React managing the DOM updates.

JJCarpenter-WPI
89% match
Loading thumbnail…

homework smiley face

A simple smiley face rendered as a static SVG graphic. The face is composed of a large outlined circle for the head, two eyes with colored pupils, and a mouth drawn using a d3.arc path with a thick stroke. The code uses React to create the SVG elements and d3.arc to define the mouth’s curved shape. The face also includes decorative lines for hair and additional details, all positioned using SVG coordinates.

KKaitlyn Boyle
88% match
Loading thumbnail…

Homework smiley face part III

A yellow smiley face is drawn on a black-stroked circular face, with two black eyes and a downward-curving mouth rendered as an SVG path. The visualization uses React to construct the SVG elements and D3’s `arc` API to generate the mouth arc path, with hardcoded dimensions for the face, eyes, and stroke. The code defines constants for positioning and sizes, then renders the shapes inside a transformed group.

11tang
88% match
Loading thumbnail…

Smiley Face - homework

A smiling face is drawn as a yellow circle with black outline, two black eyes, and a partial arc for a mouth, all rendered as SVG in React. The code uses `d3.arc` to compute the mouth path, with fixed dimensions for features. A green hat shape is added via two rotated rectangles. D3 and React are loaded from CDNs, and the visualization appears centered on a blank canvas.

Aarkykra
87% match
Loading thumbnail…

Assignment1

This example uses React and D3 to render a stylized smiley face as an SVG graphic. The face is composed of a yellow circle with a black stroke, two black eyes, and a mouth drawn using the D3 `arc` generator with specified inner and outer radii and angles. The `arc` path is generated with `d3.arc()`, while React manages the SVG elements and D3 v6 provides the arc calculation. The visualization demonstrates a simple, static data-free composition with hardcoded dimensions and coordinates.

AAtharvap2000
87% match
Loading thumbnail…

smiley face pt1

This example draws a simple smiley face using SVG shapes in a React application. A large yellow circle forms the head, with two smaller black circles for eyes, all positioned using explicit center coordinates and offsets. The code also defines a `mouthArc` using `d3.arc()` but does not render it in the final output. The visualization is rendered with D3 v7 for the arc generator and React 18 for the DOM structure, with the entire face centered on a fixed 960x500 canvas.

Sshre1310
86% match