1. 缘起

去年开始学钢琴，在学习的过程中需要对简化后的曲子逐步增加内容，还原至原曲。这就需要迭代曲谱，手画太难看，就起心动念搜索一下电子作谱工具。找到的一些专业软件太重了，直到有一天在小众软件上看到了 Arya – 支持 DOM、五线谱、流程图、时序图的在线 Markdown 编辑器 的推荐。



2. 工具溯源

在 Arya 的 GitHub 主页上发现它特别鸣谢了  Vditor（一款浏览器端的 Markdown 编辑器，支持所见即所得、即时渲染（类似 Typora）和分屏预览模式）。



Vditor



在 Vditor 的鸣谢里发现了 abcjs（JavaScript library for rendering standard music notation in a browser）。

abcjs

P.S. 我还在 GitHub 上以如下关键字做了搜索：

• 五线谱

• score for piano

• staff

• stave

3. 使用

日常使用可以直接使用 Arya 和 Vditor 的在线编辑器，使用方法参照示例即可：

```abc
X: 24
T: Clouds Thicken
C: Paul Rosen
S: Copyright 2005, Paul Rosen
M: 6/8
L: 1/8
Q: 3/8=116
R: Creepy Jig
K: Em
|:"Em"EEE E2G|"C7"_B2A G2F|"Em"EEE E2G|\
"C7"_B2A "B7"=B3|"Em"EEE E2G|
"C7"_B2A G2F|"Em"GFE "D (Bm7)"F2D|\
1"Em"E3-E3:|2"Em"E3-E2B|:"Em"e2e gfe|
"G"g2ab3|"Em"gfeg2e|"D"fedB2A|"Em"e2e gfe|\
"G"g2ab3|"Em"gfe"D"f2d|"Em"e3-e3:|
```



渲染效果如图：