All examples By author By category About


D3JS quadtree nearest neighbor algorithm

This example adapts mbostock's quadtree brushing demo to find the nearest neighbor (shown red) of a new point (shown yellow). Choose a new point to classify by clicking on the diagram. (An alternative approach for nearest neighbors of the mouse position is D3's Voronoi polygons, but the idea here would extend to rapidly classifying many new points against a base collection of points.)

We use a data-dependent order of recursion through the quadtree in order to quickly find a nearby point and then exclude many large rectangles without testing actual points. Green rectangles are visited, with saturation indicating depth in the quadtree. Only the orange points from the base collection are tested for Euclidean distance, other rectangles are excluded with a simple margin test.

I found it helpful to add extent and depth data to the quadtree nodes, maybe a useful general extension?