Instructions

  1. Make sure you are running a browser with WebGL enabled.
  2. Click in black box to add another point to the set of input points.
  3. Click and keep mouse down to temporarily add a point. Drag your mouse around to watch how the new input point influences the Voronoi diagram. On release, the new point will be added.
  4. To make a query point, such that the Voronoi diagram will display the stolen area from the nearest neighbors, check the NNI query point box before adding the point.
  5. If you would like to save a diagram for reuse later, copy the data from the data field and simply reload it in later.
For more info read my blog post on the app.

Settings

Width:
Height:
Cone Radius:
Triangles/cone:
NNI Query point?

Input data

Motion

Speed (Pixels/sec):
User defined:
Define your own speed function below with Javascript in terms of time t (optional array, length 4, of random variables rand):
Examples:
  • Sinusoidal: 5 * Math.sin(t)
  • Random linear speed: rand[0]* 15
  • Random quadratic speed: 2 * rand[1] * t + rand[0] * 10
  • Possibly cubic: Math.round(rand[1]) * Math.pow(t,2) + rand[0] * 10

Interactive Voronoi Diagram Generator with WebGL