Custom style notes with svg

[Omar Guzman]

Is there away to make the note head an svg?

Looking through the documentation I see we can customize with StaveNote setStyle but it says it is for color settings in example: setStyle strokeStyle: "blue"  how would i go about making it something like setStyle image: image.svg, etc.  Or even a png.

[Omar Guzman]

On Wednesday, November 22, 2017 at 3:48:10 PM UTC-8, Omar Guzman wrote:

Is there away to make the note head an svg?

Looking through the documentation I see we can customize with StaveNote setStyle but it says it is for color settings in example: setStyle strokeStyle: "blue"  how would i go about making it something like setStyle image: image.svg, etc.  Or even a png.

To add a little bit to my question:

In VexFlow you can change the color of a note head or strokeStyle like this:

    var stave_notes = notes.map(function(note) { return new VF.StaveNote(note); });

    stave_notes[0].setStemStyle({ strokeStyle: 'orange' });

    stave_notes[1].setStemStyle({ strokeStyle: 'orange' });

    stave_notes[1].setKeyStyle(0, { fillStyle: 'chartreuse' });

    stave_notes[2].setStyle({ fillStyle: 'orange', strokeStyle: 'tomato' });

The above would change the color of a note to be an orange.  Is there anyway to create a note head out of an eps or svg?  For example:

    stave_notes[1].setKeyStyle(0, { fillStyle: 'myimage.svg' });

The above would not work but I wanted to see if someone can give me some direction as to what would work.