日記に楽譜を表示できるようにした。
この日記ははてな記法で書いてるので、super pre 記法でABC記譜法を書くと、該当箇所を abcjs でレンダリングしなおすという実装にした。
MathJax のようにサーバサイドでSVG変換して埋め込むようにしたいけど、すぐできることではなくて面倒なので、今のところクライアントサイドでやっている。
abcjs のデモページで書いてからコピペするのがよさそう。意外と対応してない記法とかもある。
abcjs で大譜表
以下のようにするとピアノ用の大譜表にできる。
M:4/4 L:1/4 K:C K: %%staves {1 2} V:1 treble !1!CDEF | EDCz | EFGA | GFEz V:2 bass !5!!1![G,C,]2 [G,C,]2 | [G,C,]2 [G,C,]2 | [G,C,]2 [G,C,]2 [G,C,]2 [G,C,]2
こんな感じにする。 V:1 treble と V:2 bass でそれぞれト音記号・ヘ音記号になる。%%staves {1 2} で2つをまとめる。
指番号は !0! のように指定できる。けど abcjs だとあんまり見やすくないかな。