Violin plots
allow to visualize the distribution of a numeric variable for one or
several groups. They are very well adapted for large dataset, as
stated in
data-to-viz.com. Note that 2 approaches exist to build them in d3.js, the first
computing a __kernel density estimate__, the second building a high
resolution __histogram__.

Using Binning with

`d3.histogram()`

The `d3.histogram()`

takes a numeric variable, split it
into __bins__ and count the number of value per bin. See the
histogram section for basic examples. It
is possible to represent the histogram with a __mirror effect__ for
each group and using a curving function for __smoothing__: it makes
the violin plots below.

Using Kernel density estimation

Another way to build a violin plot is to compute a
__kernel density estimate__. This is what is done in the
density plot and
ridgeline plot sections. As you can see,
the result is slightly different compared to above.

Going further

A few examples expanding the concepts described above to build custom violin charts.

Selection of blocks