Algorithm Visualiser ✨
A graphical visualisation of advanced data structures and algorithms.
Site preview hosted on GitHub Pages: https://madelinben.github.io/visual-algorithms/
🗺 Page Layout
- Initial data and containers organised.
- Holy Grail Grid layout formatted.
- Page styling added, centering header elements inline with flex containers.
- Device Boundaries and Scaling formatted suitable for desktop and tablet/mobile proportions.
- Add git repo link to credit.
🔮 Display Array
- Dynamically add div boxes based on array size.
- Set index width and height properties according to viewport size.
- Center array container and anchor to bottom of page.
- Colour visiting and completed index boxes to visualise swapping.
🧙 Sorting Handler
- Implement update methods for switching index values and adjusting div heights based on value.
- Highlight divs on visiting each index for comparison and when they are locked in order.
- Develop Sorting Methods!
🐞 BUGS!
- Algorithm completes as the Animation Timer is paused.
- Deactivate input buttons to prevent multiple async sorts from occuring.
- Div Values are erroneous when the dataset is adjusted by anything less than before.
What's Next!
- Scale div heights as a percentage of the largest value.
- Adjust each Div Element as the window is adjusted.
- Bucket Sort.
- Format Timer label at bottom of page to represent alg time complexity.
- Dynamically import Algorithm Script files.