SVGで五線譜を描く(その3)

旧画像

staff3-title

続きです。
ト音記号を描きます。

ト音記号の素材は https://azukichi.net/ からいただきました

~$ wget https://azukichi.net/img/music/onpu064.png

inkscapeを開きます。
figure-inkscape-0804-1

素材をインポートします。
figure-inkscape-0804-2

ペンツールで、ベジェ曲線を描いて行きます。
figure-inkscape-0804-4

はみ出しても後で調整できます。
figure-inkscape-0804-5

ノードツールで、位置を調整します。
figure-inkscape-0804-6

リンクしている素材を削除します。
figure-inkscape-0804-7

ノードツールで、微調整します。
figure-inkscape-0804-8

黒く塗りつぶします。
figure-inkscape-0804-9

描いたパスはテキストでこうなりました。

~$ grep d=.m G_clef.svg | fold -w80 -s
     id="metadata7">
       d="m 56.35986,168.66933 c 0,0 -4.61429,-0.97143 -5.82857,-7.77143 
-1.69321,-9.48198 10.88767,-14.08481 16.75714,-10.44286 5.0332,3.12306 
5.49313,13.26802 3.15714,17.97143 -7.39019,14.87984 -32.05714,6.31429 
-33.02857,-12.38571 -0.85171,-16.39547 23.31429,-34.24286 23.31429,-34.24286 
15.69195,-18.14484 14.27911,-29.83344 5.1,-45.9 -9.67568,6.65963 
-13.98784,17.86559 -12.87143,28.41428 0.37615,3.13466 11.41428,91.55715 
11.41428,91.55715 -0.97143,1.7 0.60315,6.29524 -7.04285,9.71428 
-5.75143,2.57185 -13.95304,-3.97819 -10.44286,-4.61428 2.43211,-0.44074 
6.02055,-2.16783 6.55714,-7.04286 0.43495,-3.9516 -3.88571,-9.22857 
-10.68571,-6.31429 -9.70669,7.11557 0.006,19.9073 12.38571,20.64286 
11.15395,-1.12296 11.46971,-11.74642 11.17143,-17.00001 -0.25271,-3.70639 
-10.68571,-84.02856 -10.68571,-84.02856 -0.24286,-5.1 3.59877,-18.50425 
9.95714,-18.94286 3.30325,-0.22786 5.82315,8.82371 1.45714,15.78572 
-8.98571,14.32857 -33.79055,29.19106 -35.21428,44.68571 -1.58507,16.3288 
12.24666,29.92904 26.71428,30.35714 7.60069,-0.91625 18.84479,-6.24743 
20.15714,-21.12857 0.94007,-10.65967 -8.01428,-18.21428 -19.91428,-16.75714 
-2.98171,0.36511 -10.17437,4.05167 -12.14286,9.95714 -2.57761,8.56468 
2.2775,14.91145 9.71429,17.48572 z"

前回のスクリプトにpath行を加えると、以下のようなスクリプトになりました。

~$ fold -w60 -s staff-f4.sh | cat -n
     1	line(){
     2	x=120
     3	for i in $@;do 
     4	onkai=`expr 200 - $i \* 10`
     5	b2=`expr $onkai - 5`
     6	b1=`expr $onkai - 70`
     7	bx=`expr $x + 12`
     8	cat <<EOL
     9	<ellipse cx="$x" cy="$onkai" rx="14" ry="9" fill="black" 
    10	transform="rotate(-25,$x,$onkai)"/>
    11	<line x1="$bx" y1="$b1" x2="$bx" y2="$b2" stroke="black" 
    12	stroke-width="2.5"/>
    13	EOL
    14	x=`expr $x + 60`;
    15	done
    16	}
    17	a=`line 0 1 2 3 4 5 6 7`
    18	
    19	cat <<EOL > /tmp/tmp.svg
    20	<svg width="640" height="280">
    21	<rect x="0" y="0" width="640" height="280" 
    22	fill="white"></rect>
    23	<line x1="10" y1="100" x2="1270" y2="100" stroke="black"/>
    24	<line x1="10" y1="120" x2="1270" y2="120" stroke="black"/>
    25	<line x1="10" y1="140" x2="1270" y2="140" stroke="black"/>
    26	<line x1="10" y1="160" x2="1270" y2="160" stroke="black"/>
    27	<line x1="10" y1="180" x2="1270" y2="180" stroke="black"/>
    28	<line x1="10" y1="100" x2="10" y2="180" stroke="black"/>
    29	$a
    30	    <path stroke="black" stroke-width="1"
    31	       d="m 56.35986,168.66933 c 0,0 -4.61429,-0.97143 
    32	-5.82857,-7.77143 -1.69321,-9.48198 10.88767,-14.08481 
    33	16.75714,-10.44286 5.0332,3.12306 5.49313,13.26802 
    34	3.15714,17.97143 -7.39019,14.87984 -32.05714,6.31429 
    35	-33.02857,-12.38571 -0.85171,-16.39547 23.31429,-34.24286 
    36	23.31429,-34.24286 15.69195,-18.14484 14.27911,-29.83344 
    37	5.1,-45.9 -9.67568,6.65963 -13.98784,17.86559 
    38	-12.87143,28.41428 0.37615,3.13466 11.41428,91.55715 
    39	11.41428,91.55715 -0.97143,1.7 0.60315,6.29524 
    40	-7.04285,9.71428 -5.75143,2.57185 -13.95304,-3.97819 
    41	-10.44286,-4.61428 2.43211,-0.44074 6.02055,-2.16783 
    42	6.55714,-7.04286 0.43495,-3.9516 -3.88571,-9.22857 
    43	-10.68571,-6.31429 -9.70669,7.11557 0.006,19.9073 
    44	12.38571,20.64286 11.15395,-1.12296 11.46971,-11.74642 
    45	11.17143,-17.00001 -0.25271,-3.70639 -10.68571,-84.02856 
    46	-10.68571,-84.02856 -0.24286,-5.1 3.59877,-18.50425 
    47	9.95714,-18.94286 3.30325,-0.22786 5.82315,8.82371 
    48	1.45714,15.78572 -8.98571,14.32857 -33.79055,29.19106 
    49	-35.21428,44.68571 -1.58507,16.3288 12.24666,29.92904 
    50	26.71428,30.35714 7.60069,-0.91625 18.84479,-6.24743 
    51	20.15714,-21.12857 0.94007,-10.65967 -8.01428,-18.21428 
    52	-19.91428,-16.75714 -2.98171,0.36511 -10.17437,4.05167 
    53	-12.14286,9.95714 -2.57761,8.56468 2.2775,14.91145 
    54	9.71429,17.48572 z"
    55	 />
    56	
    57	</svg>
    58	EOL
    59	inkscape -z -e out.png /tmp/tmp.svg

実行するとタイトル画像が生成されます。

コメント

タイトルとURLをコピーしました