「VexFlow タブ譜 同一コード連続弾き」の版間の差分

提供:yonewiki
(同じ利用者による、間の11版が非表示)
1,356行目: 1,356行目:
const Guitar2_St4 = new Stave(Guitar2_St3.width + Guitar2_St3.x, Guitar2_St3.y, nStaveWidth).setContext(ctx);
const Guitar2_St4 = new Stave(Guitar2_St3.width + Guitar2_St3.x, Guitar2_St3.y, nStaveWidth).setContext(ctx);
Guitar2_St4.draw();
Guitar2_St4.draw();
const Guitar2_notes4_1 = [
  new VF.StaveNote({ keys: ["g/3", "d/4", "g/4", "d/5"], duration: "8" }),
  new VF.StaveNote({ keys: ["d/5"], duration: "8" }),
  new VF.StaveNote({ keys: ["d/5"], duration: "8" }),
  new VF.StaveNote({ keys: ["d/5"], duration: "16" }),
  new VF.StaveNote({ keys: ["d/5"], duration: "16" }),
  new VF.StaveNote({ keys: ["d/5"], duration: "16" }),
  new VF.StaveNote({ keys: ["d/5"], duration: "16" }),
  new VF.StaveNote({ keys: ["d/5"], duration: "8" }),
  new VF.StaveNote({ keys: ["d/5"], duration: "8" }),
  new VF.StaveNote({ keys: ["d/5"], duration: "16" }),
  new VF.StaveNote({ keys: ["d/5"], duration: "16" }),
];
const Guitar2_notes4_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"}),
];
const Guitar2_St4_beam1_1 = new VF.Beam([Guitar2_notes4_1[0], Guitar2_notes4_1[1]]);
const Guitar2_St4_beam1_2 = new VF.Beam([Guitar2_notes4_1[2], Guitar2_notes4_1[3], Guitar2_notes4_1[4]]);
const Guitar2_St4_beam1_3 = new VF.Beam([Guitar2_notes4_1[5], Guitar2_notes4_1[6], Guitar2_notes4_1[7]]);
const Guitar2_St4_beam1_4 = new VF.Beam([Guitar2_notes4_1[8], Guitar2_notes4_1[9], Guitar2_notes4_1[10]]);
UniqueIds = getUniqueNoteheadIds(Guitar2_notes4_1, [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]);
allUniqueIds = updateAllUniqueIds(UniqueIds);
var Guitar2_St4_1Voice = new Vex.Flow.Voice({ num_beats: 4, beat_value: 4 });
Guitar2_St4_1Voice.setStrict(true);
Guitar2_St4_1Voice.addTickables(Guitar2_notes4_1);
var Guitar2_St4_2Voice = new Vex.Flow.Voice({ num_beats: 4, beat_value: 4 });
Guitar2_St4_2Voice.setStrict(true);
Guitar2_St4_2Voice.addTickables(Guitar2_notes4_2);
var formatterGuitar2_St4_1 = new Vex.Flow.Formatter().joinVoices([Guitar2_St4_2Voice, Guitar2_St4_1Voice]);
formatterGuitar2_St4_1.format([Guitar2_St4_2Voice, Guitar2_St4_1Voice], nStaveWidth - 10 - 10);
Guitar2_St4_1Voice.draw(ctx, Guitar2_St4);
Guitar2_St4_2Voice.draw(ctx, Guitar2_St4);
Guitar2_St4_beam1_1.setContext(ctx).draw();
Guitar2_St4_beam1_2.setContext(ctx).draw();
Guitar2_St4_beam1_3.setContext(ctx).draw();
Guitar2_St4_beam1_4.setContext(ctx).draw();
shiftGuitar2_St4 = addShift(
  Guitar2_notes4_1,
  [0, 1, 2, 3, 4, 6, 7, 8, 9, 10],
  [2, 2, 2, 2, 2, 2, 2, 2, 2, 2]
);


const Guitar2_Tab1_1 = new Stave(Guitar2_St1.x + nHeadMargin + 20, Guitar2_St1.y + 120, 0).setContext(ctx);
const Guitar2_Tab1_1 = new Stave(Guitar2_St1.x + nHeadMargin + 20, Guitar2_St1.y + 120, 0).setContext(ctx);
1,597行目: 1,670行目:


const Guitar2_tab_notes4_1 = [
const Guitar2_tab_notes4_1 = [
   new VF.StaveNote({ keys: ["b/5"], duration: "8" }),
   new VF.StaveNote({ keys: ["g/5"], duration: "8" }),
   new VF.StaveNote({ keys: ["b/5"], duration: "8" }),
   new VF.StaveNote({ keys: ["g/5"], duration: "8" }),


   new VF.StaveNote({ keys: ["b/5"], duration: "8" }),
   new VF.StaveNote({ keys: ["g/5"], duration: "8" }),
   new VF.StaveNote({ keys: ["b/5"], duration: "16" }),
   new VF.StaveNote({ keys: ["g/5"], duration: "16" }),
   new VF.StaveNote({ keys: ["b/5"], duration: "16" }),
   new VF.StaveNote({ keys: ["g/5"], duration: "16" }),


   new VF.StaveNote({ keys: ["b/5"], duration: "16" }),
   new VF.StaveNote({ keys: ["g/5"], duration: "16" }),
   new VF.StaveNote({ keys: ["b/5"], duration: "16" }),
   new VF.StaveNote({ keys: ["g/5"], duration: "16" }),
   new VF.StaveNote({ keys: ["b/5"], duration: "8" }),
   new VF.StaveNote({ keys: ["g/5"], duration: "8" }),


   new VF.StaveNote({ keys: ["b/5"], duration: "8" }),
   new VF.StaveNote({ keys: ["g/5"], duration: "8" }),
   new VF.StaveNote({ keys: ["b/5"], duration: "8" }),
   new VF.StaveNote({ keys: ["g/5"], duration: "16" }),
  new VF.StaveNote({ keys: ["g/5"], duration: "16" }),
];
];
const Guitar2_tab_notes4_2 = [
const Guitar2_tab_notes4_2 = [
1,636行目: 1,710行目:
const Guitar2_tab_St4_beam1_2 = new VF.Beam([Guitar2_tab_notes4_1[2], Guitar2_tab_notes4_1[3], Guitar2_tab_notes4_1[4]]);
const Guitar2_tab_St4_beam1_2 = new VF.Beam([Guitar2_tab_notes4_1[2], Guitar2_tab_notes4_1[3], Guitar2_tab_notes4_1[4]]);
const Guitar2_tab_St4_beam1_3 = new VF.Beam([Guitar2_tab_notes4_1[5], Guitar2_tab_notes4_1[6], Guitar2_tab_notes4_1[7]]);
const Guitar2_tab_St4_beam1_3 = new VF.Beam([Guitar2_tab_notes4_1[5], Guitar2_tab_notes4_1[6], Guitar2_tab_notes4_1[7]]);
const Guitar2_tab_St4_beam1_4 = new VF.Beam([Guitar2_tab_notes4_1[8], Guitar2_tab_notes4_1[9]]);
const Guitar2_tab_St4_beam1_4 = new VF.Beam([Guitar2_tab_notes4_1[8], Guitar2_tab_notes4_1[9], Guitar2_tab_notes4_1[10]]);


UniqueIds = getUniqueNoteheadIds(Guitar2_tab_notes4_1, [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]);
UniqueIds = getUniqueNoteheadIds(Guitar2_tab_notes4_1, [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10]);
allUniqueIds = updateAllUniqueIds(UniqueIds);
allUniqueIds = updateAllUniqueIds(UniqueIds);


1,650行目: 1,724行目:


var formatterGuitar2_tab_St4_1 = new Vex.Flow.Formatter().joinVoices([Guitar2_tab_St4_2Voice, Guitar2_tab_St4_1Voice]);
var formatterGuitar2_tab_St4_1 = new Vex.Flow.Formatter().joinVoices([Guitar2_tab_St4_2Voice, Guitar2_tab_St4_1Voice]);
formatterGuitar2_tab_St4_1.format([Guitar2_tab_St4_2Voice, Guitar2_tab_St4_1Voice], nStaveWidth - 10);
formatterGuitar2_tab_St4_1.format([Guitar2_tab_St4_2Voice, Guitar2_tab_St4_1Voice], nStaveWidth - 10 - 10);
Guitar2_tab_St4_1Voice.draw(ctx, Guitar2_Tab4);
Guitar2_tab_St4_1Voice.draw(ctx, Guitar2_Tab4);
Guitar2_tab_St4_2Voice.draw(ctx, Guitar2_Tab4);
Guitar2_tab_St4_2Voice.draw(ctx, Guitar2_Tab4);
1,661行目: 1,735行目:
shiftGuitar2_Tab4 = addShift(
shiftGuitar2_Tab4 = addShift(
   Guitar2_tab_notes4_1,  
   Guitar2_tab_notes4_1,  
   [0, 0, 0, 0, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9],
   [0, 0, 0, 0, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
   [0, 1, 2, 3, 4, 2, 2, 2, 2, 2, 2, 2, 2, 2]
   [0, 1, 2, 3, 4, 2, 2, 2, 2, 2, 2, 2, 2, 2,  2]
);
);


2,370行目: 2,444行目:


insertTiePathToSVG({x:shiftGuitar2_Tab3[7].x , y:shiftGuitar2_Tab3[7].y + 10}, {x:shiftGuitar2_Tab3[7].x + 35, y:shiftGuitar2_Tab3[7].y + 10});
insertTiePathToSVG({x:shiftGuitar2_Tab3[7].x , y:shiftGuitar2_Tab3[7].y + 10}, {x:shiftGuitar2_Tab3[7].x + 35, y:shiftGuitar2_Tab3[7].y + 10});
var Guitar2_tab_St4_notes1_option = {
    textContent: ["3", "0", "0", "\uFF1F", "3"], // 必須文字列
    strID: "Guitar2_tab_St4_notes1", // 必須
    Stave_x_Offset: 0,
    Stave_y_Offset: 0,
    fontSize: 50,
    fontFamily: "YonetMuFL, Arial", // オプション、デフォルトは"Bravura, Arial"
    shift_x: [{x: shiftGuitar2_Tab4[0].x, y: shiftGuitar2_Tab4[0].y},
{x:shiftGuitar2_Tab4[1].x + 10, y: shiftGuitar2_Tab4[1].y},
{x:shiftGuitar2_Tab4[2].x, y: shiftGuitar2_Tab4[2].y},
{x:shiftGuitar2_Tab4[3].x + 30, y: shiftGuitar2_Tab4[3].y},
{x:shiftGuitar2_Tab4[4].x , y: shiftGuitar2_Tab4[4].y} ], // xのオフセット値配列
    IsOffset_x_Abs: true
};
insertTextToSVG(Guitar2_tab_St4_notes1_option);
insertTiePathToSVG({x:shiftGuitar2_Tab4[8].x , y:shiftGuitar2_Tab4[8].y + 10}, {x:shiftGuitar2_Tab4[8].x + 35, y:shiftGuitar2_Tab4[8].y + 10});


var EGuitar2Text_options = {
var EGuitar2Text_options = {

2024年4月10日 (水) 22:10時点における版

VexFlow 使い方に戻る。

概要

 

 

タブ譜 同一コード連続弾き


 コードは以下のとおりです。


<div id="yonet202403Mid_Output01"></div>
<script>

</script>


 

 

VexFlow 使い方に戻る。