Animated tree demo

There are four cases for rebalancing in the AVL tree data structure. Shown are the two cases in which insertion causes a node (z) to become unbalanced because the left subtree becomes too tall; the cases when the right subtree becomes too tall are symmetrical. By clicking on the button, you can see the rebalancing that is performed in each case. In the LL case, a single tree rotation is used; in the LR case, there are two tree rotations.

This diagram is computed in real time in JavaScript, using Constrain, a constraint-based framework for creating animated diagrams.