Ove Daae Lampe: Kernel Density Estimation in WebGL
In statistics, kernel density estimation (KDE) is a non-parametric way of estimating the probability density function of a random variable. Kernel density estimation is a fundamental data smoothing problem where inferences about the population are made, based on a finite data sample. It is also known as the Parzen-Rosenblatt window method, named after Emanuel Parzen and Murray Rosenblatt, who are usually credited with independently creating it in its current form, though it appears that this latter nomenclature is more common amongst certain specialists e.g. signal processing, econometrics. Within statistical and mathematical sciences, kernel density estimation is more prevalent.
This scatterplot shows the individual samples, i.e., an item based visualization. A KDE on the other hand is a frequency based visualization, and it shows the density of samples, i.e., not the individual samples, but how many and how close there are. The same dataset and axis with our WebGL KDE looks like this:
These two images show different kernel size, or a different level of smoothing, and two different colormaps applied to show density.
This video shows interaction with WebGL KDE
Panning: Left click and drag within the view
Zooming: Right click and drag within the view. The initial position of the right click will be the center of the zoom.
Changing bandwidth and color scale: Middle click and drag within the view. Up and down changes the color scale, and left right changes the bandwidth size.
The following example is all that is needed to include an interactive Kernel Density Estimate using WebGL on your webpage.
my_kde =new KDE('#viscontainer');// Load data from a google spreadsheet.
The above code will create this output ( here just an image ):