Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of Shamatha (Calm Abiding),Vipassana (Insight Meditation)

Public visualization

Post on XLinkedIn

Viewing a saved revision (read-only)

b7d775badc1147e4b6ac233b2225be3b

Open

Fork of Shamatha (Calm Abiding),Vipassana (Insight Meditation)

0 stars0🌍 Public
NNita
Last edited Jul 22, 2025
Created on Jul 22, 2025

This interactive visualization compares Shamatha and Vipassana meditation practices across six features, including goals, methods, and outcomes. Users can click column headers to highlight either practice, dimming the other column. Built with React and D3.js v7, the chart loads data from a CSV and renders a responsive table using SVG elements, with color-coded backgrounds and hover effects driven by `ResizeObserver` and `select().join()` patterns.

AI-generated description

Buddhist Meditation Practices: Shamatha vs Vipassana

An interactive data visualization comparing two fundamental Buddhist meditation practices - Shamatha (Calm Abiding) and Vipassana (Insight Meditation).

Overview

This project presents a side-by-side comparison of Shamatha and Vipassana meditation practices, highlighting their differences in goals, methods, focus, outcomes, analogies, and relationship to each other. The visualization is built with React and D3.js for an interactive learning experience.

Features

  • Interactive Comparison Table: Click on column headers to highlight specific practices
  • Responsive Design: Adapts to different screen sizes and devices
  • Clean Typography: Uses Inter font for optimal readability
  • Smooth Interactions: Hover effects and transitions enhance user experience

Meditation Practices Compared

Shamatha (Calm Abiding)

  • Primary Goal: Concentration, tranquility, mental stability
  • Method: Single-pointed focus on one object
  • Focus: Calming the mind, reducing distractions
  • Outcome: Mental calm, clarity, absorption (Jhanas)

Vipassana (Insight Meditation)

  • Primary Goal: Wisdom, insight into reality, purification of mind
  • Method: Open, non-judgmental observation of changing phenomena
  • Focus: Seeing the true nature of phenomena (impermanence, etc.)
  • Outcome: Direct understanding of reality, leading to liberation

Technology Stack

  • React 19.1.0 - UI framework with hooks for state management
  • D3.js 7.8.5 - Data visualization and DOM manipulation
  • ES6 Modules - Modern JavaScript module system
  • CSS3 - Styling with responsive design
  • ResizeObserver API - Responsive dimension handling

Project Structure