Web上で楽譜を表示できるライブラリたちはたくさんあります。 仕事上、そういうものたちとかかわる機会がありましたので、ここで一度まとめたいと思い記事を書きました。 (全てを使ってみたというわけではないです、悪しからず。) 2018-04 時点 の情報です。
alphaTab
表示の上では最高にいいと思います。 パートが複数ある場合でも表示可能です。 進捗に合わせてバーを動かすことができます。
ただし、一般的な楽譜形式 Music XML をサポートしていないのが難点です。 GitHub では開発中みたいです。
対応している形式は次の3パターンです。
Guitar Pro 3-5 (gp3,gp4,gp5) – Those files are widely available in the internet. They are created using earlier versions of Guitar Pro (version 3 to 5).
Guitar Pro 6 (gpx) – This is the newest file format created by Arobas, the creators of Guitar Pro.
AlphaTex – AlphaTex is a text based format for writing music notation. It was created for alphaTab to allow people easy writing and storing of music notation.
Guitar Pro は有料ソフトウェアです。
これに関連したプロジェクトとして、 alphaSynth などがあります。
VexFlow
ギターのタブ符も扱えます。
バーを動かすのではなく、音符を動かすサンプルがありました。
MusicXML などの形式で読み込むというより、 音を記述すると表示してくれるというライブラリです。
OpenSheetMusicDisplay
こちらは VexFlow を用いて Music XML を表示するライブラリです。 なので、楽譜作成ソフトで作成した楽譜ファイルをそのまま表示することができます。
複数パートでも表示可能です。
Verovio
こいつはすさまじいです。 オンラインで楽譜編集までできます。
MusicXML そのものは扱えませんが、 コンバートして使うことができるみたいです。
スポンサーたくさんですね。 お金かかっています。
C++ で作られています。 ライセンスは LGPL。
abcjs
その昔私が楽譜の書ける掲示板を作ったときに使っていたものです。 ABC記法で書かれた楽譜を表示できます。
一般的に 音楽家の間でABC記法は使われていないみたいです。
abcweb
MusicXML 及び ABC記法 の楽譜を表示できるライブラリ。
scorejs
javascript で楽譜を表示できるものです。
Neon.js
ネウマ符などの楽譜編集・表示に使えるライブラリ。
これまで紹介したライブラリとは表示対象が異なります。楽譜ではあるのですが。
GUIDO
使うにはちょっと心配なところがありますが、 Javascript で楽譜の書けるライブラリです。
ngx-score (停止中)
現在停止しているプロジェクトです。
楽譜表示ができます。
さいごに
目的に応じてなにを使うかですが、一般の5線譜を使うなら alphaTab, Verovio がいいと思います。