pixi-piano-roll v1.2.3
Modules
Typedefs
pixiPianoRoll
JavaScript 2D WebGL / Canvas animated piano roll
Author: Matthew Hasbach
License: MIT
Copyright: Matthew Hasbach 2015
pixiPianoRoll(opt) ⇒ pianoRollAPI ⏏
Instantiate a pixiPianoRoll
Kind: Exported function
Param | Type | Default | Description |
---|---|---|---|
opt | Object | Options object | |
opt.width | number | 900 | Width of the piano roll |
opt.height | number | 400 | Height of the piano roll |
opt.pianoKeyWidth | number | 125 | Width of the piano keys |
opt.noteColor | number | Object.<number> | musicalScaleColors.dDJameson | Hexadecimal color of every note or object that has pitch class (chroma) property names and hexadecimal color values. See musical-scale-colors for palettes (including the default). |
opt.noteColor | number | 0x333333 | Hexadecimal color of the grid lines |
opt.noteColor | number | 0 | Hexadecimal color of the background |
opt.bpm | number | 140 | Beats per minute |
opt.activateKeys | boolean | true | If true, the color of the piano keys will change to the color of the notes that intersect them |
opt.antialias | boolean | true | Whether or not the renderer will use antialiasing |
opt.zoom | number | 4 | Amount of visible measures |
opt.resolution | number | 1 | Amount of vertical grid lines per measure |
opt.time | transportTime | 0:0:0 | The transportTime at which playback will begin |
opt.renderer | string | "WebGLRenderer" | Determines the renderer type. Must be "WebGLRenderer" or "CanvasRenderer" . |
opt.noteFormat | string | "String" | The format of the notes in opt.noteData . "String" for scientific or Helmholtz notation, "Key" for piano key numbers, "Frequency" for audio frequencies, or "MIDI" for MIDI note numbers. |
opt.noteData | noteData | [] | Note data |
Example
var pianoRoll = pixiPianoRoll({
width: 900,
height: 400,
noteColor: 0xdb000f,
gridLineColor: 0x333333,
backgroundColor: 0x1a0002,
bpm: 140,
antialias: true,
zoom: 4,
resolution: 2,
time: '0:0:0',
renderer: 'WebGLRenderer',
noteFormat: 'String',
noteData: [
['0:0:0', 'C4', '2n'],
['0:0:0', 'D4', '2n'],
['0:0:0', 'E4', '2n'],
['0:2:0', 'B4', '4n'],
['0:3:0', 'A#4', '4n']
]
});
document.getElementsByTagName('body')[0].appendChild(pianoRoll.view);
pianoRoll.playback.play();
transportTime : string
Playback position expressed in bars:quarters:sixteenths format (e.g. "1:2:0"
)
Kind: global typedef
note : string | number
Musical note expressed in Scientific notation, Helmholtz notation, piano key number, audio frequency (the closest note will be used), or MIDI note number
Kind: global typedef
noteDuration : string | number
Note duration expressed as a number (e.g. 1
for a whole note) or string (e.g. "4n"
for a quarter note)
Kind: global typedef
noteData : Array.<Array.<transportTime, note, noteDuration>>
See the typedefs for transportTime, note, and noteDuration
Kind: global typedef
pianoRollAPI : Object
The piano roll API
Kind: global typedef
- pianoRollAPI : Object
pianoRollAPI.playback : Object
Contains methods that control playback
Kind: static property of pianoRollAPI
playback.toggle(time)
Pause if playing or play if paused
Kind: static method of playback
Param | Type | Description |
---|---|---|
time | transportTime | If paused, the position to begin playing. If omitted, playback will begin at the current position. |
playback.play(time)
Begin playback
Kind: static method of playback
Param | Type | Description |
---|---|---|
time | transportTime | The position to begin playing. If omitted, playback will begin at the current position. |
playback.pause()
Pause playback
Kind: static method of playback
playback.seek(time)
Change the playback position
Kind: static method of playback
Param | Type | Description |
---|---|---|
time | transportTime | The new playback position |
pianoRollAPI.bpm : number
Change the bpm by changing this property
Kind: static property of pianoRollAPI
pianoRollAPI.zoom : number
Change the zoom by changing this property
Kind: static property of pianoRollAPI
pianoRollAPI.resolution : number
Change the resolution by changing this property
Kind: static property of pianoRollAPI
pianoRollAPI.noteData : noteData
Change the note data by changing this property
Kind: static property of pianoRollAPI
pianoRollAPI.playing : boolean
Whether or not playback is ongoing
Kind: static property of pianoRollAPI
Read only: true
pianoRollAPI.view : HTMLElement
The piano roll canvas element
Kind: static property of pianoRollAPI
Read only: true