🧮 DDA Algorithm Visualizer

An interactive web application built with React to visualize how the Digital Differential Analyzer (DDA) line drawing algorithm works step by step.

---

🚀 Features

• 🔹 Takes user input for start and end points (x1, y1, x2, y2).
• 🔹 Calculates automatically:
  • Δx, Δy
  • Slope (m)
  • Step count
  • Increment values for each axis
• 🔹 Displays a table showing every calculated point.
• 🔹 Draws the line dynamically on a canvas.
• 🔹 Shows the direction of the line (e.g., right-up, left-down).

---

🧠 How It Works

1. User enters the start and end coordinates.
2. The app calculates Δx, Δy, slope, and number of steps.
3. Using the DDA formula, the line points are generated incrementally.
4. The results are displayed in a clear table and visualized on the canvas.

---

🧩 Technologies Used

• ⚛️ React.js
• 🎨 HTML5 Canvas
• 💅 Tailwind CSS

---

🎯 Purpose

This project was created as part of a college graphics assignment to demonstrate the step-by-step working of the DDA line drawing algorithm and help students understand how computer graphics generate straight lines.

---

💡 Future Enhancements

• 🔸 Add Bresenham’s Algorithm comparison mode.
• 🔸 Implement animation for point-by-point drawing.
• 🔸 Add Dark / Light mode toggle.
• 🔸 Export points data as a CSV file.

---