paulrosen / abcjs

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

how to change spacing between notes based on timing and duration? #961

Open mohammadhasanzadeh199 opened 10 months ago

mohammadhasanzadeh199 commented 10 months ago

Hi first of all, thanks for this awesome library. I am working on a web page to animate the different songs notations. I used TimingCallbacks and synth and CSS to animate the notations and it's working correctly. gif but as you can see in this gif the animation is slowing down at some points. that's because the spacing between notes and bars is not based on note timing and duration. I checked the documentation and issues but I can't find any solution. is it possible to change spaces between notes or render them based on timing and duration?

paulrosen commented 10 months ago

Unfortunately not. I have the same effect in my apps, too. The visual spacing is set to mimic the standard spacing that you see in printed music, which is not quite equal spacing. I don't think it is a particular bad effect. We haven't had any complaints from our users.

There are some ABC directives that supply that option. If someone wants to help implement them, let me know and I can give you some pointers about how to do it. I don't have time right now, though.

crysfel commented 10 months ago

I'm working in something like this as well, ran into the same issue, specially because I'm rendering the the notes quite large. I'd like to scroll at the same speed at all times and that includes adding extra space for each note.

I want to give this a try, can you point me in the right direction?

Thanks!

brahma0545 commented 9 months ago

Hi first of all, thanks for this awesome library. I am working on a web page to animate the different songs notations. I used TimingCallbacks and synth and CSS to animate the notations and it's working correctly. gif gif but as you can see in this gif the animation is slowing down at some points. that's because the spacing between notes and bars is not based on note timing and duration. I checked the documentation and issues but I can't find any solution. is it possible to change spaces between notes or render them based on timing and duration?

is your repository public? I am working on a similar project, it's fine even if I control the speed or have an equal speed with different spaces between the notes.

paulrosen commented 9 months ago

See https://paulrosen.github.io/abcjs/audio/synthesized-sound.html#cursorcontrol-object You can set beatSubdivisions to give you callbacks often enough to have a smooth cursor.