chabb

This shows the building of the quadtree as points are added. The animation shows the traversal of the tree. A margin test is used to determine the good leaf to choose.

chabb

Based on Jason Davies’ implementation of Bridson’s algorithm. See the related explanation.

chabb

Selection Sort

This animation demonstrates the selection sort.

The main problem was to chain was to chain transition. I was doing a data join at every iteration, which discarded my current transition.

Instead, i just chained transition, and acceded the current state of the array in the transition.

Array is shuffled at the end of the algorithm. Note the filter() call on the transitions. Without the filter, sort() function would be called ten times, as there is ten .rect elements.

chabb

Insertion Sort

This animation demonstrates the insertion sort.

chabb

Bubble Sort

This animation demonstrates Bubble sorting.

chabb

I am toying with the d3 quadtree. A reference to the parent node have been added to each node. This visualisation traverses the points and highlight parent nodes

chabb

This visualisation removes point from the quadtree, and collapses nodes as necessary

chabb

k-Nearest-Neighbors

Based on this tutorial

k is randomly choosen at every iteration.

chabb

Color scale and pivot

You can easily create a color scale that map a particular domain of values. In this example, the number from 1 to 20 are mapped to the colors from white to blue.

You can even define a pivot in your scale; the color reaches its maximumal value at a given point of the domain, and then go back.

Click on the button to change the pivot

chabb

This is a graph of the sin(2t) function in a radial view.

The curve is animated without interpolating the path.

See this example