Change music font

[SirPL]

I'd like to use other music font for rendering, i.e. Bravura. Is there a way to do so? I see there's a font_generate directory, yet it's not clear for me how to use it.

[paulrosen]

Unfortunately, that's not easy at the moment - I plan to rework the way the fonts work but it won't happen for a while. You would have to replace each character the way that https://cdn.rawgit.com/paulrosen/abcjs/master/examples/change_glyphs.html does it. It would be tedious.

[ShikiSuen]

@paulrosen At least changing the clef symbols (especially the G clef) to bravura or the current Maestro (SMUFL) will be helpful. The current G clef symbol looks extremely out of (probably not only) my taste.

[ShikiSuen]

I tried this for G clef:

M13.02 47.67
C13.84 47.67
14.77 47.59
15.49 47.45
C15.88 47.38
15.95 47.35
16.02 47.77
C16.45 50.14
16.99 53.21
16.99 54.87
C16.99 60.09
13.41 60.73
11.30 60.73
C9.37 60.73
8.44 60.16
8.44 59.71
C8.44 59.46
8.76 59.35
9.59 59.10
C10.69 58.79
11.98 57.83
11.98 55.79
C11.98 53.84
10.73 52.18
8.55 52.18
C6.15 52.18
4.72 54.06
4.72 56.24
C4.72 58.54
6.12 62.00
11.52 62.00
C13.91 62.00
18.56 60.94
18.56 54.94
C18.56 52.93
17.92 49.57
17.53 47.38
C17.45 46.96
17.49 46.99
17.99 46.78
C21.60 45.37
24.00 42.37
24.00 38.38
C24.00 33.86
20.64 29.87
15.38 29.87
C14.45 29.87
14.45 29.87
14.34 29.23
L13.45 24.12
C13.38 23.69
13.45 23.66
13.66 23.44
C17.53 19.88
20.46 15.39
20.46 9.99
C20.46 6.92
19.60 3.88
18.13 1.77
C17.60 0.99
16.67 0.00
16.27 0.00
C15.77 0.00
14.66 0.92
13.95 1.69
C11.30 4.59
10.44 9.00
10.44 12.68
C10.44 14.72
10.69 17.02
10.94 18.47
C11.02 18.89
11.05 18.96
10.62 19.31
C5.47 23.51
0.00 28.56
0.00 35.70
C0.00 41.84
4.26 47.67
13.02 47.67

M2.86 38.06
C2.86 35.98
3.22 33.19
6.19 29.87
C8.33 27.50
9.98 26.20
11.66 24.86
C12.02 24.57
12.09 24.61
12.16 25.00
L12.91 29.52
C13.02 30.19
13.02 30.15
12.38 30.36
C9.23 31.42
7.19 34.21
7.19 37.21
C7.19 40.39
8.87 42.65
11.30 43.46
C11.59 43.57
12.02 43.68
12.27 43.68
C12.55 43.68
12.70 43.50
12.70 43.29
C12.70 43.04
12.41 42.93
12.16 42.83
C10.66 42.19
9.59 40.67
9.59 39.05
C9.59 37.04
10.98 35.52
13.16 34.92
C13.73 34.78
13.81 34.81
13.88 35.20
L15.67 45.72
C15.74 46.11
15.70 46.11
15.17 46.22
C14.59 46.32
13.88 46.39
13.16 46.39
C6.90 46.39
2.86 42.97
2.86 38.06

M16.81 5.47
C17.99 5.47
18.96 6.43
18.96 8.37
C18.96 12.29
15.56 15.46
12.73 17.90
C12.48 18.11
12.34 18.08
12.27 17.62
C12.13 16.70
12.05 15.50
12.05 14.37
C12.05 8.86
14.63 5.47
16.81 5.47

M15.77 34.64
C18.67 34.88
21.07 37.28
21.07 40.39
C21.07 42.62
19.71 44.42
17.70 45.41
C17.28 45.62
17.20 45.62
17.13 45.19
L15.38 35.13
C15.31 34.71
15.34 34.60
15.77 34.64
z

Got rendered results like this:

But it gets rendered in an actual HTML like this (in abc2.3):

[paulrosen]

Sorry for the delay - I'm hoping to update this to make it easier, but I'm not sure when. Off the top of my head I'd guess that you are using absolute positioning in your definition.

Here's a hack you can use to avoid having to deal with the fonts: If you create the music with renderAbc(.... , { add_classes: true }) then right after that call look for the clefs like this: var clefs = document.querySelectorAll(".abcjs-clef"), then for each clef replace the "d" attribute, like this: clefs[0].setAttribute("d", "your path")