In addition to data and target, there are a couple of non-mandatory options available which can be passed to the MEI Snippet Viewer constructor. Many of these properties can also be specified in the MEI document (for example, page measurement). If there is a property both passed to the constructor and defined in the document, the first will override the document's value.

Page measurements

  • {Number} pageScale : The scaling of the fragment (set 1 for 100%, 0.5 for 50% etc.), defaults to 1
  • {Number} pageHeight : The height of the fragment (defaults to 350)
  • {Number} pageWidth : The width of the fragment (defaults to 800)
  • {Number} pageTopMar : The top page margin (defaults to 60)
  • {Number} pageLeftMar : The left page margin (defaults to 20)
  • {Number} pageRightMar : The right page margin (defaults to 20)


  • {Number} systemSpacing : The default spacing between two staff (defaults to 90)
  • {Number} staveSpacing : The default spacing between two staffs within a system; overridden by the spacing attribute of a staffDef element in the MEI code (defaults to 60)
  • {Number} maxHyphenDistance The maximum distance (in pixels) between two hyphens in the lyrics lines (defaults to 75)

Processing steps

  • {Boolean} autoMeasureNumbers : Specifies if measure numbers should automatically be added to each system start (defaults to false)
  • {Boolean} useMeiLib : Specifies if the MeiLib library should be used to pre-process the input XML document. Necessary when there are variants in the MEI document (defaults to false)
  • {Boolean} processPgHead : Specifies if pgHead elements should be processed.
  • {Object[]} preProcess : XML document pre-processing options. Set falsy if pre-processing should be skipped completely.
  • {Object[]} layers : The canvas layers used for highlighting and Mouse move handling. See Layers. Can be either a subclass of MSV.AreaCollection like MSV.DefaultAreaCollection or, to specify the layer to contain the VexFlow output, an object with the property type with the value vex. The first layer will be the bottom-most, the last one the top-most. If no VexFlow layer is specified, a VexFlow Layer gets added automatically as the top-most layer.
  • {Boolean} autoStaveConnectorLine : Specifies if a stave connector line should be drawn on the left of systems by default; if set to true, the auto line will not appear when staffDef/@symbol="none" is set for the outermost staffDef element (defaults to true)
  • {"full"/"abbr"/null} labelMode : Specifies the way voice labels are added to staves (defaults to null). Values:
    • 'full': renders full labels in the first system, abbreviated labels in all following systems
    • 'abbr': only render abbreviated labels
    • null or undefined: renders no labels


  • {Object} lyricsFont The font used for rendering lyrics and hyphens (defaults to { family : 'Times', size : 15 })
  • {Object} annotFont : the font used for annotations like 'pizz.' (defaults to { family : 'Times', size : 15, weight : 'Italic' })
  • {Object} dynamFont : the font used for dynamics (defaults to { family : 'Times', size : 18, weight : 'bold italic' })
  • {Object} tempoFont : The tempo font (defaults to { family : 'Times', size : 17, weight : 'bold' })
  • {Object} measureNumberFont : The measure number font. An object in which font family, font size and weight can be specified. Defaults to { family : 'Times', size : 14, weight : 'Italic' }. Note: The weight properties can be used to specify style, weight or both (space separated); some of the objects are passed directly to vexFlow (which requires the name 'weight'), so the name is 'weight'
  • {Object} anchoredTextFont : The default font used with anchored texts. An object in which font family, font size and weight can be specified. Defaults to { family : 'Times', size : 22, weight : '' }