Skip to main content
SimilarExport ZIP
100%

Fork of Fork of The Heart of Prajñāpāramitā

✓ Published2🌍 Public
NNita
Last edited Mar 27, 2025
Created on Mar 27, 2025

This visualization explores Buddhist concepts from the Heart Sutra through an interactive network. A force-directed graph using `d3.forceSimulation` displays sixteen concept nodes with labeled relationships, where hovering highlights connected paths and a search feature filters results. Users can switch between four views—including a Dharma wheel and mandala layout—via a dropdown selector that rebuilds the SVG visualization from the same relationship data. The accompanying text includes tooltips for Buddhist terminology.

AI-generated description

The Heart of Prajñāpāramitā

A web-based exploration of key Buddhist concepts from the Heart of Prajñāpāramitā Sutra (Heart Sutra), one of the most important texts in Mahayana Buddhism.

Features

  • Explanatory passages about core Buddhist concepts
  • Interactive glossary of key Buddhist terminology
  • Four different D3.js visualizations to explore concept relationships:
    • Force-Directed Network
    • Dharma Wheel
    • Mandala View
    • Path to Enlightenment Tree

Technologies Used

  • HTML5, CSS3, JavaScript
  • D3.js for data visualization
  • Google Fonts (Cormorant Garamond, Nunito)

Visualizations

The project includes multiple ways to visualize and interact with Buddhist concepts:

  1. Force-Directed Network: Explore how concepts relate to each other in a dynamic network.
  2. Dharma Wheel: View concepts organized in a traditional Dharma wheel structure.
  3. Mandala View: See concepts arranged in a mandala-inspired concentric pattern.
  4. Path to Enlightenment: Follow the path from suffering to enlightenment through key concepts.

Usage

Simply open index.html in a modern web browser to explore the content and visualizations.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Fork of The Heart of Prajñāpāramitā

This interactive visualization explores the interconnected philosophical concepts of the Heart Sutra, mapping the relationships between core Buddhist terms such as Śūnyatā (emptiness), Bodhicitta (awakened mind), and the three poisons. The view presents a force-directed network where nodes represent concepts and weighted links show thematic connections, with search and filtering capabilities to highlight specific ideas. Built with d3.js v7, the SVG network responds to hover interactions, displaying tooltips with definitions. A selector offers alternative visual layouts—including a Dharma Wheel, Mandala, Path to Enlightenment, and Wisdom & Compassion Union—though these views primarily reframe the same concept data.

NNita
94% match
Loading thumbnail…

Fork of The Heart of Prajñāpāramitā

The Heart of Prajñāpāramitā presents an interactive concept map of Buddhist philosophy, visualizing relationships between key terms like Śūnyatā, Karma, and the Four Noble Truths from the Heart Sutra. The visualization uses D3 v7's force-directed graph layout with `d3.forceSimulation`, featuring draggable nodes and hover tooltips. Users can switch between four visualization types, including a dharma wheel and mandala view, and search for concepts to highlight related connections. The SVG rendering animates node positions and link opacity based on user interaction.

NNita
93% match
Loading thumbnail…

Fork of Fork of Fork of The Heart of Prajñāpāramitā

This visualization maps the interconnectedness of core Buddhist concepts using an interactive force-directed network. The diagram displays 24 terms—such as Śūnyatā, Dukkha, and Bodhicitta—as nodes grouped by theme, with weighted links (relationships) connecting them. Built with d3.forceSimulation, the layout uses SVG and animated transitions to position nodes dynamically. Users can explore the network's structure, with hoverable controls revealing descriptions of each concept. Code includes d3.drag and d3.zoom for interaction.

NNita
93% match
Loading thumbnail…

Fork of Fork of HTML Starter

This visualization presents the Heart of Prajñāpāramitā with an interactive force-directed graph of key Buddhist concepts, colored by category and connected by weighted links. The D3.js visualization uses `d3.forceSimulation` with link, many-body, center, and collision forces to position nodes, with link thickness representing relationship strength. Concept definitions appear in a tooltip on hover. The surrounding page pairs the Sanskrit text with terminology cards, though the visualization itself derives from a hardcoded dataset of 16 concepts and 15 relationships.

NNita
91% match
Loading thumbnail…

The Heart of Prajñāpāramitā

This visualization presents an interactive exploration of Buddhist concepts from the Heart of Prajñāpāramitā through four distinct views: a force-directed network, a dharma wheel, a mandala, and a linear path to enlightenment. The main view uses d3.forceSimulation to display interconnected terms with draggable nodes, zooming, panning, and hover tooltips containing descriptions. A search feature highlights matching concepts, while a selector switches between visualization styles. The SVG-based rendering color-codes nodes by category such as Wisdom, Suffering, and Causality.

NNita
89% match
Loading thumbnail…

The Heart of Prajñāpāramitā

This visualization maps the core concepts of Buddhism, illustrating the relationships between ideas such as the Four Noble Truths, the Eightfold Path, and Śūnyatā. An interactive network graph and an animated dharma wheel show conceptual clusters and links between terms, rendered as SVG using D3.js’s force-directed layout (d3.forceSimulation). A control panel allows switching between the network view, a wheel, and a mandala visualization.

NNita
88% match
Loading thumbnail…

Fork of Fork of The Teachings of the Buddha 2

An interactive visualization presents the core concepts of Buddhism, including the Dharma wheel, the Noble Eightfold Path, the Four Noble Truths, and floating lotus flowers. The SVG scene uses D3.js v7 to construct the elements, with the Dharma wheel rotating through `transition.attrTween`. The eightfold path is shown as a radial layout with labeled circles, while a gradient background and meditation ripple animations add a serene atmosphere. The visualization is built from the HTML and CSS files, with an emoji-based Buddha figure.

NNita
81% match
Loading thumbnail…

Fork of The Teachings of the Buddha 2

This visualization explores the Bodhichitta teachings of Buddhism, centered on a pulsing heart symbol and surrounded by nodes for the Two Types of Bodhichitta and other related concepts. It uses D3.js v7 to build an SVG scene with d3 transitions for animations, including a heart pulse, floating lotus flowers, jewels, and meditation ripple effects. The design features a gradient background and color scheme representing compassion and wisdom, with quotes changing periodically. Data is drawn from Buddhist teachings on Bodhichitta, visualized through emoji-based graphics and custom SVG shapes.

NNita
81% match