Привет, ребята! В этой статье я кратко расскажу о своем проекте под названием визуализатор сортировки. В этом проекте вы можете визуализировать сортировку выбором, пузырьковую сортировку и алгоритм быстрой сортировки.
Я использовал HTML, CSS и Javascript для создания проекта.
Чтобы инициализировать проект, вы должны создать файл HTML, CSS и javascript и прикрепить файл CSS и javascript к HTML, используя теги стиля и скрипта соответственно.
Первое, что нам нужно визуализировать, — это массив, поэтому мы создадим блоки разных размеров, чтобы мы могли использовать для них алгоритмы сортировки.
Ниже приведен код для создания блоков/элементов массива.
Теперь мы создали наш массив, поэтому нам нужно отсортировать массив с заданными алгоритмами сортировки.
Например, если мы выберем сортировку выбором, ниже будет код
В этой сортировке выбором мы извлекаем все блоки, которые мы сделали, а затем выбираем первый элемент и добавляем класс, чтобы мы знали элемент, который будет заменен. Чтобы визуализировать обмен, я добавил setTimeout. После замены наш окончательный вывод будет выглядеть так.
Ссылка на проект: https://sortvisualiser.netlify.app/
Твиттер : https://twitter.com/rohityadav2604
GitHub: https://github.com/rohityadav2604/Sort-visualizer
Не стесняйтесь связаться со мной, если у вас есть какие-то сомнения по этому поводу.
Удачного кодирования.
