/Tree-Visualizer-React-Project

It is a React Project, aiming to visualize various tree data structure

Primary LanguageJavaScript

Welcome to Tree Visualizer! It is a React application aiming to help visualize various tree data structures. While learning them I was drawing trees again and again. So I wondered how easier it would be if the system displayed the structure. Hence I made this project to help someone starting with trees and also to give me a better understanding of them.

Project comprises the following data structures:

Binary Search Tree

Trie

AVL Tree

Red Black Tree

Max Heap

Min Heap

Features visualized in each data structure

Trie

  • Real-time searching of a word
  • Inserting a word
  • Deleting a word
  • Insert N random words (up to 993 words, but limited by screen size)

BST

  • Inserting a node
  • Searching a node
  • Deleting a node
  • Randomly inserting N nodes
  • Traversals
  • Balancing tree
  • Checking whether the tree is balanced, full, complete or perfect

AVL Tree

  • Same as BST except balancing feature (As it is a self-balancing tree)
  • Heights a displayed in the node

Red Black Tree

  • Same as AVL Tree
  • Nodes are coloured black or red

Min heap and Max Heap

  • Inserting a node
  • Extracting the topmost node
  • Deleting a node

I personally relished making Trie. When nodes lighted up when I typed in the search bar amazed me. I hope you enjoy learning with my creation.