An interactive web application to learn about mathematical relations and functions visually!
- 4 real-world examples of relations
- Interactive visualization with connecting lines
- Learn the difference between relations and functions
- Beautiful, colorful, and engaging UI
- Perfect for students learning intro to functions
Visit the live site: https://YOUR_USERNAME.github.io/relations-visualizer
(Replace YOUR_USERNAME with your GitHub username)
- What is a relation?
- How to identify connections between sets
- The difference between relations and functions
- Domain and range concepts
- Real-world applications of mathematical relations
- React 18
- Tailwind CSS
- SVG for connection lines
- Vanilla JavaScript
Simply click on different example cards to explore various types of relations:
- Students & Grades
- People & Birth Months
- Cities & Countries
- People & Favorite Foods
Toggle the "Show/Hide Connections" button to see the relationships!
Feel free to fork this project and add your own examples of relations!
Free to use for educational purposes!
Built to help students overcome math anxiety and visualize abstract concepts!
Made with ❤️ for math learners everywhere