「VexFlow タブ譜 コードフォーム」の版間の差分
| 936行目: | 936行目: | ||
const Guitar2_St2 = new Stave(Guitar2_St1.width + Guitar2_St1.x, Guitar2_St1.y, nStaveWidth).setContext(ctx); | const Guitar2_St2 = new Stave(Guitar2_St1.width + Guitar2_St1.x, Guitar2_St1.y, nStaveWidth).setContext(ctx); | ||
Guitar2_St2.draw(); | Guitar2_St2.draw(); | ||
const Guitar2_St2_notes_1 = [ | |||
new VF.StaveNote({ keys: ["b/4"], duration: "1" }), | |||
]; | |||
const Guitar2_St2_notes_2 = [ | |||
new VF.GhostNote({ keys: ["f/4"], duration: "16"}), | |||
new VF.GhostNote({ keys: ["f/4"], duration: "16"}), | |||
new VF.GhostNote({ keys: ["f/4"], duration: "16"}), | |||
new VF.GhostNote({ keys: ["f/4"], duration: "16"}), | |||
new VF.GhostNote({ keys: ["f/4"], duration: "16"}), | |||
new VF.GhostNote({ keys: ["f/4"], duration: "16"}), | |||
new VF.GhostNote({ keys: ["f/4"], duration: "16"}), | |||
new VF.GhostNote({ keys: ["f/4"], duration: "16"}), | |||
new VF.GhostNote({ keys: ["f/4"], duration: "16"}), | |||
new VF.GhostNote({ keys: ["f/4"], duration: "16"}), | |||
new VF.GhostNote({ keys: ["f/4"], duration: "16"}), | |||
new VF.GhostNote({ keys: ["f/4"], duration: "16"}), | |||
new VF.GhostNote({ keys: ["f/4"], duration: "16"}), | |||
new VF.GhostNote({ keys: ["f/4"], duration: "16"}), | |||
new VF.GhostNote({ keys: ["f/4"], duration: "16"}), | |||
new VF.GhostNote({ keys: ["f/4"], duration: "16"}), | |||
]; | |||
UniqueIds = getUniqueNoteheadIds(Guitar2_St2_notes_1, [0]); | |||
allUniqueIds = updateAllUniqueIds(UniqueIds); | |||
var Guitar2_St2_Voice_1 = new VF.Voice({ num_beats: 4, beat_value: 4 }); | |||
Guitar2_St2_Voice_1.setStrict(true); | |||
Guitar2_St2_Voice_1.addTickables(Guitar2_St2_notes_1); | |||
var Guitar2_St2_Voice_2 = new VF.Voice({ num_beats: 4, beat_value: 4 }); | |||
Guitar2_St2_Voice_2.setStrict(true); | |||
Guitar2_St2_Voice_2.addTickables(Guitar2_St2_notes_2); | |||
var formatterGuitar2_St2 = new VF.Formatter().joinVoices([Guitar2_St2_Voice_1, Guitar2_St2_Voice_2]); | |||
formatterGuitar2_St2.format([Guitar2_St2_Voice_1, Guitar2_St2_Voice_2], nStaveWidth - 20 - 10); | |||
Guitar2_St2_Voice_1.draw(ctx, Guitar2_St2); | |||
Guitar2_St2_Voice_2.draw(ctx, Guitar2_St2); | |||
shiftGuitar2_2st= addShift( | |||
Guitar2_St2_notes_1, | |||
[0], | |||
[3] | |||
); | |||
const Guitar2_St2_1 = new Stave(Guitar2_St1.width + Guitar2_St1.x + 45, Guitar2_St1.y, 0).setContext(ctx); | const Guitar2_St2_1 = new Stave(Guitar2_St1.width + Guitar2_St1.x + 45, Guitar2_St1.y, 0).setContext(ctx); | ||
2024年4月12日 (金) 23:28時点における版
VexFlow 使い方に戻る。
概要
コードフォームをタブ譜に載せるという手法もありまして、コードが一小節で2種類くらいしか無いような曲で見られる描画方法です。その場合、五線譜には同一コード用の音符を使ってリズムだけをハタ棒とハタあるいは連桁で表現します。管理人は左利きなので、左利き用のコードフォームを表示してみました。人生初くらいだな。左利き向けのコードフォームタブ譜なんて見たことなかった。もちろん、作成したフォントには右利き向けのグリフも登録してあります。あとちょっとで完成しそうですね。フォントファイル。もうちょっとで配布できるようになる。駆け抜けたい。でもこの先まだまだ難しいタブ譜作成技術の紹介が残っています。手ごわい。アーム操作の曲線とかどうするべって感じ。VexFlowも不完全だし、機能追加にも疲れてきたっすね。
タブ譜 コードフォーム
コードは以下のとおりです。
<div id="yonet202403Mid_Output01"></div>
<script>
</script>
VexFlow 使い方に戻る。