paulrosen / abcjs

javascript for rendering abc music notation
Other
1.89k stars 281 forks source link

Is it possible to add numbered musical notation? #980

Open hhaiwwww opened 8 months ago

hhaiwwww commented 8 months ago

微信截图_20231221150359 ABCjs is great,I would like to add a notation display function that can be switched to display with the staff notation. I'm not sure if this feature is available

paulrosen commented 8 months ago

It would be possible to extend abcjs to do this, but it isn't available out of the box.

There is a way to run abc through the parser only without doing output. Then you have a structure you could step through to do your own drawing.

So, what I'd do:

const visualObj = abcjs.renderAbc("*", abcString)

Then write a function that steps through visualObj[0].lines and writes the output.

hhaiwwww commented 6 months ago

I still don't quite understand. Will you improve this feature on your end

cgzwyy commented 3 months ago

i need this function too how can i user abcjs to draw NMN

sysescool commented 3 months ago

I need this function too. I'm using joplin, and which use abcjs. Staff (music) is hard to me, while numbered musical notation is easy.

May you make it is available out of the box?

sysescool commented 1 month ago

@paulrosen I would like to incorporate numbered musical notation. Could you please assign this task to me? However, before I commence work on it, I have a few questions for discussion:

  1. Should we retain the existing code notation (a, b, c, d, e, f) but render it in numbered musical notation?
  2. Is it preferable to introduce a new numbered code notation (1, 2, 3, 4, 5, 6) that is exclusively rendered as numbered musical notation?
  3. When considering a new numbered code notation (1, 2, 3, 4, 5, 6) alongside the original symbols, should both sets be capable of rendering as either Musical notation or Numbered musical notation?

Which approach would be more advantageous?

paulrosen commented 1 month ago

According to the picture, there isn't anything in common with the drawing of standard notation so I think the way to handle it is probably to have a separate drawing function.

If you want to render any existing abc file as numbered notation I'd suggest the first option of retaining the existing code notation. Then you can do this:

const visualObj = abcjs.renderAbc("*", abcString)

to take advantage of the existing parser.

Then write a function with a signature something like this:

engraveNumbered(selector, visualObj[0])

That function would look for the element specified in selector and create an <svg> element in that. Then it would go through visualObj[0].lines and convert the notes to numbers and insert them into the svg.

In other words, you don't need to modify any of the existing abcjs code - just write your own function to extend it.

sysescool commented 1 month ago

Thank you, I will try it today.