Dominance Pattern Classifier

A React-based Machine Learning application that classifies genetic inheritance patterns using a custom Decision Tree algorithm. The application can classify three types of dominance patterns:

• Complete Dominance: Classic 3:1 ratio in F2 generation
• Incomplete Dominance: 1:2:1 ratio with intermediate phenotypes
• Codominance: Both alleles expressed simultaneously

Features

• Custom Decision Tree implementation from scratch
• Synthetic data generation for training
• Real-time model training and evaluation
• Interactive prediction interface
• Visualization of model performance metrics
• Beautiful, responsive UI with Tailwind CSS

Installation

1. Navigate to the project directory:

cd dominance-classifier

2. Install dependencies:

npm install

Running the Application

Start the development server:

npm start

The application will open in your browser at http://localhost:3000

Demo

Main Interface

The application features a two-column layout for training and prediction:

Features shown:

• Step 1: Train Model (Left Column):

  • Generate synthetic genetic data
  • Train Decision Tree classifier
  • View model performance metrics (100% accuracy achieved)
  • Per-class metrics (Precision, Recall, F1 Score)

• Step 2: Make Predictions (Right Column):

  • Input P1 Generation percentages (Homozygous Dominant, Heterozygous, Homozygous Recessive)
  • Input F1 Generation phenotype count
  • Input F2 Phenotypic ratios
  • Get real-time predictions with confidence scores

Model Insights & Visualization

After training, the application displays comprehensive model insights:

Visualizations include:

• Class Distribution (Pie Chart): Shows equal distribution across three dominance patterns

  • Complete Dominance: 33.3%
  • Incomplete Dominance: 33.3%
  • Codominance: 33.4%

• Performance Metrics (Bar Chart): Displays precision, recall, and F1 scores for each class

  • All metrics showing 100% performance across all classes
  • Visual comparison of model accuracy

• Key Features Used: Lists the genetic features the model analyzes

  • P1 Genotype Distribution
  • F1 Phenotype Count
  • F2 Phenotypic Ratios

Usage

1. Train the Model: Click "Train Model" to generate synthetic training data and train the Decision Tree classifier
2. Make Predictions: Enter phenotypic ratios from genetic crosses:
   • P1 Generation percentages (Homozygous Dominant, Heterozygous, Homozygous Recessive)
   • F1 Generation phenotype count
   • F2 Generation phenotypic ratios
3. View Results: The model will classify the dominance pattern with confidence percentage and explanation

Project Structure

dominance-classifier/
├── src/
│   ├── components/
│   │   └── DominancePatternClassifier.jsx  # Main component
│   ├── App.jsx                              # App component
│   ├── App.css                              # App styles
│   ├── index.js                             # Entry point
│   └── index.css                            # Global styles with Tailwind
├── public/
│   └── index.html                           # HTML template
├── package.json                             # Dependencies
├── tailwind.config.js                       # Tailwind configuration
├── postcss.config.js                        # PostCSS configuration
└── README.md                                # This file

Technologies Used

• React 18
• Tailwind CSS
• Recharts (for data visualization)
• Lucide React (for icons)
• Custom Decision Tree ML algorithm

License

MIT