block by vasturiano e70e14483fe01eb0a3ea7d1d46a30571

Musical Hexagons

Full Screen

A two-dimensional spatial arrangement of the chromatic musical notes. Contrary to the traditional piano keyboard, this is a fully relative layout, equivalent intervals are always equidistant to each other.

The corresponding note is played by hovering over the keys, using the browser’s Web Audio API. Use the selectors to specify the interval of adjacent notes in either dimension, and modify the tesselation pattern.

Project developed during D3 unconf 2016.

index.js

index.html

style.css