02 6 / 2010

Music Notation with HTML5 Canvas

Mohit Muthanna has been busy working on his music notation renderer written using canvas.  Music notation is a very complex beast, and supporting all of the nuances that can be found is a not a task for the faint of heart.  The renderer is able to display notes, clefs, guitar tabs, accidentals, key signatures, beams, all note values with correct rhythmic positioning, multiple voices in each staff and much more.

Mohit also says that this library is not just for rendering of musical scores, but it could also be used for an interactive editor for said scores.  This could become really interesting since I haven’t seen many attempts at this on the web before - I haven’t even seen any Flash sites!

Canvas is becoming really powerful!  You can check out the blog post here and see a demo of the renderer here.

Great work!