100%

Fork of Emptiness

✓ Published0🌍 Public

Last edited Apr 6, 2025

Created on Apr 6, 2025

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.

AI-generated description

Emptiness and Form

An interactive visualization exploring the relationship between emptiness and form.

Interaction

Hover over the central emptiness to reveal forms
Hover over individual forms to highlight them
Click on forms to see them return to emptiness

This visualization draws inspiration from Eastern philosophical concepts where form emerges from emptiness and returns to it.

MIT Licensed

Similar vizzes

Loading thumbnail…

Emptiness

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.

NNita

80% match

Loading thumbnail…

Mind and Emptiness

This animated D3.js visualization depicts the Buddhist relationship between mind and emptiness through a circular diagram with four interactive segments. A central gold circle represents the mind, surrounded by four colored arcs that each illustrate a philosophical aspect—inherent emptiness, interdependence, realization, and non-duality. Hovering over a segment highlights it and dims the others while revealing its associated description. The visualization uses D3's `pie` and `arc` generators to create the equal-size segments, with text wrapping for labels and smooth transitions on hover.

NNita

77% match

Loading thumbnail…

Fork of Fork of Fork of HTML Starter

This interactive visualization explores Buddhist philosophy through a serene, animated composition. It displays a rotating Dharma wheel, the Noble Eightfold Path arranged in a circular diagram, and floating lotus flowers and Bodhi tree leaves. The piece uses D3.js v7 with SVG rendering and custom animations via `transition.attrTween` to rotate the wheel. It also generates meditation ripple effects and periodically displays Buddha quotes. A soft gradient background and emoji-based graphics create a peaceful, mindful atmosphere, with hover interactions on the Bodhi leaves.

NNita

74% match

Loading thumbnail…

Fork of meditation

This visualization depicts a stylized meditating figure constructed from abstract, geometric SVG shapes. Built with React, the SVGCanvas component renders a gradient-background scene, incorporating a vibrant orange body, a red head with purple hair, and simplified facial features conveying serenity. The figure’s pose is static, composed of layered paths for the head, body, arms, and legs against a blue ground. The code defines all visual elements directly via JSX, using standard SVG tags like path, circle, and rect within a linear gradient.

GGorantla Vishnusai

74% match

Loading thumbnail…

Fork of meditation

GGorantla Vishnusai

74% match

Loading thumbnail…

Fork of Untitled

This interactive visualization uses a circular packing layout to display the hierarchical structure of the flare dataset, with nested circles representing categories and their sub-items sized by a numeric value. Clicking a circle zooms into that node, smoothly animating the view through a tween on the interpolateZoom function while adjusting label visibility and opacity for the new focus. The SVG is rendered with D3 v4, using the d3.pack layout and d3.hierarchy API to compute circle positions, and a linear color scale with HSL interpolation to encode depth. The code is built as a React component, though the visualization itself relies on direct DOM manipulation through D3 selections.

LLaowei42

73% match

Loading thumbnail…

Fork of Fork of Fork of Fork of Fork of Fork of Buddha in colors -overlapping Buddha

This visualization presents a dense, abstract composition of hundreds of overlapping, semi-transparent circles scattered across a green background, created with React and rendered as SVG. The circles are positioned through nested loops over a fixed array, with coordinates and colors generated by random values, producing a chaotic yet colorful field of dots. In the center, a large Buddha figure drawn with dark green paths is overlaid, its semi-transparent fills and strokes creating layered, translucent intersections that echo the random arrangement of circles. The piece explores themes of chance, repetition, and visual noise through its overlapping forms.

SSree Yuktha Sunkara

73% match

Loading thumbnail…

Fork of 6 Buddha

This example displays an abstract, colorful composition of overlapping Buddha-like forms rendered on an SVG canvas. The visualization generates a dense matrix of semi-transparent colored rectangles using nested React `map` functions, with randomized positions and RGB fill values. The main visual element is a large, intricately detailed Buddha path drawn through an SVG `<path>` element with a complex `d` attribute, transformed and scaled to overlap the background pattern. The implementation uses React 16.10.0 and ReactDOM to manage the SVG structure, while the page includes a flower-pattern background image and a large text message.

Lleelakrishnadivi7@gmail.com

73% match