Sorting visualiser
Type a short list and pick a sort. Press Play to watch the bars being compared, swapped and shifted, with the Java line that is running lit and a sentence saying what just happened. Use the arrow keys or the slider to go back and forth.
How to use it
- 1Pick bubble, selection or insertion sort and type 2 to 10 whole numbers, or tap an example.
- 2Press Show me, then Play. Each comparison, swap and shift is shown one at a time.
- 3Read the sentence under the bars and watch the Java line that is running. Use Back to see a step again.
The animation needs JavaScript. Every step is written out below.
Result
- Result
- sorted: 2, 4, 5, 6, 7
Every step in words (26 steps)
- Start: the list is 7, 4, 5, 2, 6. Sort it into ascending order.
- Pass 1: take key = a[1] = 4 and insert it into the sorted part on its left.
- Is a[0] > key? 7 > 4 is true, so shift 7 one place right.
- a[1] = a[0]: 7 moves right.
- j has gone past the start of the list, so stop.
- Put the key 4 at position 0. The first 2 values are now in order.
- Pass 2: take key = a[2] = 5 and insert it into the sorted part on its left.
- Is a[1] > key? 7 > 5 is true, so shift 7 one place right.
- a[2] = a[1]: 7 moves right.
- Is a[0] > key? 4 > 5 is false, so stop.
- Put the key 5 at position 1. The first 3 values are now in order.
- Pass 3: take key = a[3] = 2 and insert it into the sorted part on its left.
- Is a[2] > key? 7 > 2 is true, so shift 7 one place right.
- a[3] = a[2]: 7 moves right.
- Is a[1] > key? 5 > 2 is true, so shift 5 one place right.
- a[2] = a[1]: 5 moves right.
- Is a[0] > key? 4 > 2 is true, so shift 4 one place right.
- a[1] = a[0]: 4 moves right.
- j has gone past the start of the list, so stop.
- Put the key 2 at position 0. The first 4 values are now in order.
- Pass 4: take key = a[4] = 6 and insert it into the sorted part on its left.
- Is a[3] > key? 7 > 6 is true, so shift 7 one place right.
- a[4] = a[3]: 7 moves right.
- Is a[2] > key? 5 > 6 is false, so stop.
- Put the key 6 at position 3. The first 5 values are now in order.
- Done. The sorted list is 2, 4, 5, 6, 7.
About the Sorting visualiser
What it does
Sorts your list in ascending order with the sort you pick and shows every step: which two values are being compared, which are swapped or shifted, and which are already in their final place. Each step has a sentence in words and the matching Java line marked in the code.
The three sorts
- Bubble sort: compares neighbouring values and swaps them if they are in the wrong order; after each pass the largest remaining value has moved to the end. It stops early if a whole pass makes no swap.
- Selection sort: finds the smallest value in the unsorted part and swaps it into the next place.
- Insertion sort: takes the next value (the key) and shifts the larger values to its left one place right, then drops the key into the gap.
Common questions
What is the difference between bubble sort and selection sort?
Bubble sort swaps neighbouring values many times as the large values bubble to the end. Selection sort looks through the unsorted part to find the smallest value and makes just one swap per pass.
Why does my bubble sort stop early?
If a complete pass makes no swap, the list is already in order, so the sort can stop. Try the sorted-list example to see it.
Can I sort numbers that repeat?
Yes. Equal values are not swapped by bubble sort or insertion sort, so they keep their order.
Can I see the code in Python, JavaScript or C++?
Yes. Choose the language in the menu above the code. Only the listing changes: the steps are always worked out from the Java program that ISC uses, and the highlighted line moves to the matching line of the language you chose.
Practise on real ISC questions
- A class InsSort contains an array of integers which sorts the elements in a particular order. Some of the…2024
- A class SortAlpha has been defined to sort the words in the sentence in alphabetical order. Example: Input…2023
- Design a class BinSearch to search for a particular value in an array. Some of the members of the class are…2020
- State the best case and the worst case complexity for bubble sort algorithm.2020
- [Programme based on Strings] Two words are called anagram of each other if both the words contain the same…2025 Practice
- [Arrays] Given below is an example of a double dimensional array with unequal number of rows and columns. It…2025 Practice
- Design a class Sort which enables a word to be arranged in alphabetical order. The details of the members of…2020 Specimen
More Computer Science tools
- Boolean algebra solverSimplify any expression: the laws step by step, truth table, K-map and the logic circuit.
- Infix to postfix converterInfix to postfix or prefix with the stack table, and postfix evaluation step by step.
- Binary tree and BST toolBuild a binary search tree, rebuild a tree from two traversals, and get every traversal and fact.
- Stack and queue simulatorRun push, pop, insert and delete on a stack, queue, circular queue or dequeue, and watch the pointers move.
- Recursion visualiserWatch factorial, Fibonacci, power, GCD and sum of digits run: the calls, the call stack and the returns.
- Tower of Hanoi visualiserWatch the discs move between the pegs while the recursive calls and the call stack build up.
- Binary search tree visualiserWatch values being inserted into a binary search tree, searched for, and walked inorder, preorder and postorder.
- Binary tree traversal visualiserClick a binary tree together and watch preorder, inorder and postorder walk it, with the recursive calls on the call stack.
- Stack and queue visualiserWatch push, pop, insert and delete move top, front and rear along the array, with overflow and underflow.
- Linked list visualiserWatch nodes being added, deleted, searched, traversed and reversed, with start, p, prev and curr moving along the arrows.
- 2D array visualiserWatch row-wise, column-wise, diagonal, boundary and spiral walks number the cells of a 2D array in the order they print.
- Linear and binary search visualiserWatch a linear or binary search look for a value in your list, and count the comparisons.