paulrosen / abcjs

javascript for rendering abc music notation
Other
1.94k stars 285 forks source link

Slur Should Render Different Than Tie. #838

Open JonathanILevi opened 2 years ago

JonathanILevi commented 2 years ago

Graphically a slur should connect the stems not the heads. A slur should also not overlap stems.

(Good) Here is an example of a tie and two different slurs rendering in another program. image

(Poor) Here is the same notes rendering the same tie and slurs in Abcjs. image

Not a big deal, but it is not ideal. Abcjs has definitely come a long way from what I remember Abcjs once did... image

Thanks for all your work on this library! It's been a delight to ride along and benefit from it's improvements over the past 5 years!

JonathanILevi commented 2 years ago

Here is the ABC code for the images.

X:1
L:1/4
K:Fmaj
%%score ( s0 a0)
V:s0 clef=treble
V:a0 clef=treble
[V:s0] C | A2B/>G/ | c2B/G/ | F2E | F2 || A | (AG)G | =B2B | c2 ||
[V:a0] C | F2G/>E/ | ((A-F)D) | C2C | C2 || F | F2F | (DG)F | E2 ||
paulrosen commented 2 years ago

Thanks! It's been fun working on it.

The example isn't exactly the same notes. In the second one ((A-F)D) the second note is an F but in the first one the second note is an A.

This is a border case - in theory a tie should ALWAYS be between two of the same notes so I think technically this is a syntax error. However, it is so common and most people don't know or care about the difference between a slur and a tie that I am permissive in the syntax. So a "tie" between two different notes is handled as a slur.

But I guess the real change you are asking for is for the slur to be moved away from the note heads. I don't remember all the rules that went into the placement, but I remember it was complicated. I looked through some varied music to see how it was handled in general and didn't see a concise set of rules.

If I had a consistent set of rules that worked for varied input (stems up/down, wide/narrow intervals, multiple notes of different melodic shapes, other symbols near by) then I'll revisit it.

JonathanILevi commented 2 years ago

Yeah. I'm sure it is complicated, and with a lot of variables.

That makes sense with the tie on different notes, sorry about the mistake in the images. Abcjs, however, never renders a tie "correctly", even when a tie is actually tie. A tie should not look quite the same as a slur, it is a subtle visual clue to the musician of what is happening. I guess it is a minor thing, but it not quite as good. Not ABCJS: image

One place where this does matter with a tie, is when you have a tie under a slur (which does happen). image

A tie should come from the corner of the note head, and close to the note head. A slur should not be so close.

The slur is definitely more complicated, as it has to work with multiple notes, and has to deal with stems. I have couple ideas which might improve it some more, though I don't know how easily it can be implemented in your code. I think the primary thing that looks bad is overlapping lines.

If a slur is coming from the stem side of a note with a bar, it should come from the end of the stem. Not ABCJS: image ABCJS: image

When a slur needs to go over a note with with a stem, it should move away, so as to not overlap. This appears to already be the case, but doesn't work with multiple parts on a staff? ABCJS: image image image

A couple things I tested seemed to work great in ABCJS with a single part. Most of the problems I find are primarily a problem with multiple parts on a staff (as in 4-part harmony).

Feel free to file this away. If you ever take another look at slurs, maybe it'll be helpful.

Thanks again!