Vexflow: question: how to render a multi-line scores ?

[lilybucher]

Hi there ! Vexflow is really nice looking, thanks for this incredible software :-)

My question may look silly but I parsed all tests and docs and did not find any mention on how to create a multi-line score. The only multi-line score I saw uses Vextab on the vexflow.com first page...

How do I create a score with multiple lines (just rendering staves puts them on top of each other) ?

[lilybucher]

Simply add new VF.Stave, with increasing y_offset (second argument) for each new line. Sample code:

lines.forEach((line, idx) => {
  const voice = new VF.Voice({num_beats: line.numBeats, beat_value: beatValue})
  voice.addTickables(line.allNotes)

  new VF.Formatter().joinVoices([voice]).format([voice], 400)
  // VF.Formatter.FormatAndDraw(context, stave, line.allNotes)

  const stave = new VF.Stave(10, linePadding + idx * lineHeight, 400 + 80)
  stave.addClef(score.clef)
  .addTimeSignature(score.signature)

  stave.setContext(this.VFcontext).draw()
  voice.draw(context, stave)
  line.beams.forEach(beam => {
    beam.setContext(context).draw()
  })
})

[SalahAdDin]

@gaspard Can you put this in documentation?