Skip to main content
SimilarExport ZIP
100%

Emptiness

✓ Published1🌍 Public
NNita
Last edited Apr 6, 2025
Created on Apr 6, 2025

This minimalist visualization titled “Emptiness” renders a single white circle with a light gray outline centered against a plain white background, with the word “Emptiness” displayed in large, faint typography above it. The React application uses a ResizeObserver via a custom `useDimensions` hook to track container size, then passes dimensions to D3 v7 in `renderSVG` and `renderBars` to draw the SVG circle and title text. The circle subtly responds to hover by slightly darkening its stroke, emphasizing the sparse, contemplative aesthetic.

AI-generated description

Emptiness

A minimalist visualization representing the concept of emptiness.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Emptiness

This visualization presents a meditation on emptiness and form through an interactive animated diagram. A central circle represents emptiness, surrounded by eight wedge-shaped paths that act as forms, initially displayed at reduced opacity. Hovering over the center reveals the forms, while individual forms highlight on hover; clicking a form triggers a scale-and-rotate animation that visually collapses it back toward emptiness. The piece uses React for state and dimension handling via `useDimensions` with a `ResizeObserver`, while D3 v7 manages all SVG rendering, transitions, and event handlers.

NNita
80% match
Loading thumbnail…

NVDV06242022A

This example displays a single empty SVG circle element, with no visible data or interaction. The page is a minimal HTML structure using a static SVG markup and a simple CSS-styled message. It is built with the React framework and renders through SVG, though the code only defines the circle’s tag without attributes, so nothing is drawn on screen. The example serves as a bare-bones starter template, demonstrating the basic file structure without implementing any visualization logic or external libraries.

Ggkellyjr2
76% match
Loading thumbnail…

Untitled

A minimal interactive visualization using React and D3 v6 displays a blank canvas that fills the browser window. The page sets the body to hide overflow and logs the computed height to the console, but no data or visual elements are rendered. The code imports the full D3 library but does not call any visualization functions, leaving the space empty. It demonstrates a bare-bones setup for future chart development, relying on `window.innerWidth` and `window.innerHeight` for sizing.

Aaissatheprogrammer
76% match
Loading thumbnail…

Hello

This visualization shows a plain SVG canvas with a single unfilled circle positioned at the top-left corner, rendered at 960 by 500 pixels. The circle has a radius of 200 but no fill or stroke, making it effectively invisible against the white background. The code uses only native HTML and SVG elements—no JavaScript, CSS styling, or external libraries—relying on the SVG `<circle>` tag within an inline `<svg>` element. The minimal structure demonstrates a bare-bones React starter template context, though no React components or data processing are actually employed.

KKelvinYQC
75% match
Loading thumbnail…

Untitled

A single green circle is centered on a plain SVG canvas, demonstrating a minimal React-based visualization setup. The code uses an SVG `<circle>` element with hardcoded coordinates and dimensions, rendered directly in an HTML page. The page imports a stylesheet that resets margins and hides overflow, ensuring the circle displays cleanly. This example serves as a basic starting point for building more complex visualizations with React and SVG.

CChristian Magelssen
75% match
Loading thumbnail…

Data-Viz-01

This example displays a single, empty SVG element centered on a plain white page, with the body text scaled to an oversized 13em font size. Although the page structure suggests a potential data visualization, no data or graphical content is actually rendered; the SVG remains blank. The implementation uses raw HTML, CSS, and JavaScript without any external libraries or frameworks, despite the metadata referencing React. The visualization shows only the empty scaffolding of an SVG container, with no visible charts, marks, or interactive behavior present in the code.

SSteinarV-design
75% match
Loading thumbnail…

Untitled

A yellow circle with a black outline dominates the center of a 960-by-500 SVG canvas, flanked by two smaller unfilled circles positioned symmetrically above its midpoint. The visualization uses React 18.2.0 via the UMD production build, though no React components are defined; instead, static SVG elements are placed directly in the markup. The code sets the body overflow to hidden and logs "jello" to the console, while an external stylesheet specifies a 2em font size. The chart shows only primitive geometric shapes with no data binding or interaction.

AadnaneAkk
74% match
Loading thumbnail…

Blank Canvas

A blank SVG canvas fills the browser viewport, displaying only a large rounded rectangle that spans the entire window. The visualization demonstrates a minimal setup for a data-driven document, using D3 v6 within a React framework. The code defines the canvas size dynamically based on the window's width and height, then appends a single rectangle element with rounded corners via the SVG API. This example serves as a starting point for building interactive visualizations, with the styling ensuring a fixed, full-screen layout.

EEmma
74% match