SVG: Crisper Lines
SVG lines render best when they are precisely placed on the canvas. SVG centers all lines on the coordinates, so lines with a stroke width of an odd number of pixels must be placed on a coordinate that ends in .5; lines with even numbered stroke widths should be placed on integer values. The is especially important for horizontal and vertical lines, especially in MuseScore where horizontal staff lines and vertical stems and bar lines are everywhere. Then there are ledger lines and beams, which are also very common (beams may not be purely horizontal, but their left and right edges are always vertical).
With the DPI_F = 5 factor in 3.0, SVG Export is exporting these lines at whole number stroke widths, which makes this improvement plausible. (this change cannot be applied to version 2)
Staff lines stroke width is 2px, barlines is 4px, both even numbers.
Stems and ledger lines are 3px.
The other reason that DPI_F enables this change is that now the canvas is 5 times larger in both dimensions. It means that rounding values, changing them by a maximum of 0.5 pixels, will not be visible to anyone's eye, not even on an 8K monitor. The only thing that's visible is the improved rendering, crisper lines, sharper edges.
Here is the diff page for the branch:
It changes 2 functions in 1 file: drawPath() and drawPolygon(). They happen to be the last two functions in the file.
edit: the x and y code is reversed here: https://github.com/sidewayss/MuseScore/blob/2e732c7a370df17676cc52f52ee…
I'm in the middle of something else on my working branch right now. I'll fix this and post new example files.
It's a simple set of changes:
1) Beams are drawn by Qt as path elements in SVG. They have no stroke, only fill, so the best thing is to round all the x and y coordinates in the path. Paths without fill look best with whole number values. This change is in drawPath().
2) Staff lines and bar lines are both even numbers, so all of their coordinates can be rounded.
3) Stems need their x coordinate to end in .5
4) Ledger lines need their y coordinate to end in .5
All three of these - 2,3,4 - are drawn as polyline elements in SVG. This change is in drawPolygon().
Currently MuseScore exports SVG files that render as very large pages by default. I have edited the two attached SVG files to zoom them out enough to see them in a browser window without scrollbars. It's a more normal size for viewing. In your browser, or whatever container, zoom in and out and compare the two files. I do it with two tabs, and switch between the tabs with the zoom levels aligned. Your browser/container might not give you a lot of options, but at 100% I can see differences, stems that are fuzzy versus clean, for example. Zooming to different levels exposes different fudging/rounding that the browser does. Part of the reason you don't see a big difference here is because this score has the default spatium value of 25.000. That means the staff lines are already on integer y-coordinates, so the new code has no effect on them.
This is an small change to one file that improves SVG file rendering at any zoom level, in any container. It's ready for a PR whenever you are.
Also note: I have edited these SVG files to extend the staff lines to the proper width. For more information on the fix I have ready for that open issue, see here: