Wow

100%

✓ Published0🌍 Public

Last edited Jun 2, 2021

Created on Jun 2, 2021

This example displays a simple, static SVG scene: a large yellow circle with a black outline sits at the center of an aliceblue canvas, flanked by two smaller solid circles. The visualization is built using React to render the SVG elements, while D3 v4 is used solely to append an “Bruh” heading to the page body. The code defines fixed dimensions and positions for each shape, with no interaction or data-driven updates.

AI-generated description

A bare minimum HTML page.

MIT Licensed

Similar vizzes

Loading thumbnail…

Hello WORLD D3

This example shows a single large yellow circle with two smaller black circles positioned to resemble a face, rendered directly in SVG via static markup in the HTML. The code uses React 18 to mount an `App` component, though the visual itself is defined outside React in the `index.html` file, with the circles' coordinates and stroke properties set manually. The page loads React and ReactDOM from unpkg, and the SVG has a fixed width of 960 and height of 500, with no D3.js API calls present despite the title referencing D3.

RRegina Flores

82% match

Loading thumbnail…

DataViz

This example shows a static SVG scene with a large yellow circle outlined in black, centered on a 960 by 500 canvas, and a smaller unfilled circle overlapping it to the left. The HTML page uses inline CSS to remove body margins and hide overflow, while the SVG markup defines the shapes directly within the document. The circles are constructed using standard SVG `<circle>` elements with explicit `cx`, `cy`, `r`, `fill`, and `stroke` attributes. No JavaScript or React logic is present; the visualization relies entirely on static SVG rendering.

Mmacl23

81% match

Loading thumbnail…

D31

This example displays a static, hand-coded SVG scene on an HTML page, featuring a large red circle with a black outline and two smaller black circles positioned within it. The page loads React 18.2.0 from a CDN and uses `ReactDOM.render` in `index.js` to inject a simple "Hello Jsx" heading into a separate root element, while the SVG is placed directly in the markup. The visualization relies on raw SVG elements, not React-generated drawing, and includes no interactive or data-driven behavior.

AAjoshi1988

80% match

Loading thumbnail…

Hello html

This example renders a simple, static SVG scene of a yellow circle with a black outline and two smaller unfilled circles representing eyes. The React-based application uses JavaScript to define dimensions and stroke properties, passing them into the SVG element. The code loads React and ReactDOM from CDN and renders the graphic into a root div, demonstrating a minimal setup for SVG visualization with React.

Ssukhmani0117

80% match

Loading thumbnail…

Hello HTML

This example displays a simple, static SVG face composed of three circles: a large red circle for the head and two smaller black circles for the eyes. The HTML page sets up the SVG canvas with fixed dimensions and defines the circles directly in the markup. The code loads React 17, ReactDOM, and D3 v7 from a CDN, but renders the visualization using plain SVG elements rather than JavaScript-driven data binding or animation.

KKenny Barns PIERRE

80% match

Loading thumbnail…

Hello HTML

This example displays a large yellow circle framed by a black stroke, with two smaller unfilled circles positioned as eyes, all rendered within an SVG canvas. The code leverages React via unpkg's production build and directly uses SVG elements like `circle` and attributes such as `cx`, `cy`, `r`, and `fill`. Static coordinates and stroke styling define the composition, with CSS applied to remove page margins and hide overflow. The visualization demonstrates basic SVG drawing without interactive or dynamic behavior.

GGibbsGundah

80% match

Loading thumbnail…

Fork of Circles with D3

This example demonstrates a static SVG scene of a large yellow circle with a black outline and two smaller black-bordered circles positioned inside it, resembling a face. The visualization is built using React 18 and D3 v7, rendering all shapes through an SVG component in a `react-dom` root. The code defines circles with explicit `r`, `cx`, `cy`, `fill`, and `stroke` attributes, while the page layout uses an embedded stylesheet to remove margins and hide overflow. The example serves as a creative foundation, inviting modifications like thematic styling for holidays.

Aaltugbozyaka@gmail.com

80% match

Loading thumbnail…

Dataviz_Tutorial

This example shows a simple static SVG scene of a yellow circle with a black outline, overlaid with two smaller black circles representing eyes, resembling a smiley face. The visualization renders entirely through inline SVG markup within an HTML page, using a fixed coordinate system and hard-coded dimensions. It loads React, though no components are instantiated, and the page also includes an inline script logging React to the console. The SVG elements are drawn directly with basic shapes, without any data binding or interaction.

7767576232@qq.com

80% match