User:Cmloegcmluin/SVG to PNG conversion sandbox: Difference between revisions

← Older edit

VisualWikitext

@@ Line 1: / Line 1: @@
-These SVGs and PNGs are generated by the web app.
+==Flavors of Sagittal notation==
+Sagittal notation comes in two compatible ''flavors''.
+===Evo===
+The '''Evo''' flavor (short for "evolutionary", previously called "mixed") uses only single-shaft Sagittal symbols, e.g. <span style="line-height: 16px">{{Bravura|&#xE302; &#xE303; &#xE304; &#xE305;|250%}}</span>, alone or in combination with conventional sharps and flats and their doubles. Only the large variant of the double sharp <span style="line-height: 16px">{{Bravura|&#xE47D;|250%}}</span> (U+E47D) is considered to be stylistically-compatible with Sagittal symbols. Evo is much easier to learn, but it results in a greater number of symbols on the sheet, which can give it a more cluttered appearance, particularly with chords, and it may be confusing when two symbols alter the same note in opposite directions.
+<span id="Evo-SZ"></span> A sub-flavor of Evo is '''Evo-SZ''' (Evo with Stein-Zimmermann). This is where the arrow-like [[33/32|11M]] up and down symbols <span style="line-height: 16px">{{Bravura|&#xE30A;|250%}}</span> <span style="line-height: 16px">{{Bravura|&#xE30B;|250%}}</span> are replaced by the Stein-Zimmermann semisharp <span style="line-height: 16px">{{demisharp|250%}}</span> and narrow reversed flat <span style="line-height: 16px">{{Bravura|&#xE284;|250%}}</span>. This should only be done when the 11M symbols notate exactly half the alteration of a sharp or flat. Similarly, <span style="line-height: 16px">{{Bravura|&#xE30A;|250%}}&#x200A;{{sharp|250%}}</span> and <span style="line-height: 16px">{{Bravura|&#xE30B;|250%}}&#x200A;{{flat|250%}}</span> are replaced by <span style="line-height: 16px">{{sesquisharp|250%}}</span> and <span style="line-height: 16px">{{Bravura|&#xE285;|250%}}</span>. The narrow variants of the fractional flats <span style="line-height: 16px">{{Bravura|&#xE284;|250%}}</span> (U+E284) and <span style="line-height: 16px">{{Bravura|&#xE285;|250%}}</span> (U+E285) are preferred because they preserve the Sagittal principle that the visual size of a symbol should indicate the relative size of its alteration.
+===Revo===
+The '''Revo''' flavor (short for "revolutionary", previously called "pure") only requires one accidental per note. Revo therefore takes up less space on the sheet and presents a cleaner appearance, and it clearly indicates the direction of the overall alteration. It discards the conventional sharps and flats and their doubles and replaces them with these multi-shaft arrow-like symbols: <span style="line-height: 16px">{{Bravura|&#xE318; &#xE319; &#xE334; &#xE335;|250%}}</span>. Adding a sharp or flat to a Sagittal is achieved by adding two more shafts, e.g. <span style="line-height: 16px">{{Bravura|&#xE302;|250%}}&#x200A;{{sharp|250%}}</span> becomes <span style="line-height: 16px">{{Bravura|&#xE31E;|250%}}</span> and <span style="line-height: 16px">{{Bravura|&#xE305;|250%}}&#x200A;{{flat|250%}}</span> becomes <span style="line-height: 16px">{{Bravura|&#xE321;|250%}}</span>. When the Sagittal part alters in the opposite direction to the sharp or flat part, the rules are not so simple, e.g. <span style="line-height: 16px">{{Bravura|&#xE303;|250%}}&#x200A;{{sharp|250%}}</span> becomes <span style="line-height: 16px">{{Bravura|&#xE314;|250%}}</span> and <span style="line-height: 16px">{{Bravura|&#xE304;|250%}}&#x200A;{{flat|250%}}</span> becomes <span style="line-height: 16px">{{Bravura|&#xE313;|250%}}</span>&#x200A;; one must simply learn these ''[[2187/2048#Notation|apotome]] complements''.
+==PNGified SVN horizontal and vertical alignment experiments==
+experiments These SVGs and PNGs are generated by the web app.
 sp0 (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ;
-SVG [[File:Test1.svg]]
+SVG <imagemap>
+File:Test1.svg
+rect 0 0 100 100 [https://sagittal.org#periodic-table Periodic Table]
+desc none
+default [[File:Test1.svg]]
+</imagemap>
 PNG [[File:Test1b.png]]
@@ Line 13: / Line 32: @@
 PNG [[File:Test2.png]]
-These SVGs and PNGs are generated by the Node scripts.
+These SVGs and PNGs are generated by the Node script.
 sp0 (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ; (|||\ ;
@@ Line 19: / Line 38: @@
 SVG [[File:Test3.svg]]
-PNG [[File:Test3b.png|653x234px]]
+PNG [[File:Test3b.png|528x80px]]
 ston 24; 24; 24; 24; 24; 24; 24; 24; 24; 24; 24; 24; 24; 24; 24; 24; 24; 24; 24; 24; 24; 24; 24; 24;
@@ Line 25: / Line 44: @@
 SVG [[File:Test4.svg]]
-PNG [[File:Test4b.png|707x234px]]
+PNG [[File:Test4b.png|575x80px]]
+These SVGs were generated by the Node script, with a 0.5px vertical offset.
+SVG [[File:Test6.svg]]
+SVG [[File:Test5.svg]]