ページ概要
ImageMagickによる描画事例です.
全コマンドを含むバッチファイルを下に示します.
bat_IMK.txt | このページの全コマンドを含むバッチファイル |
掲載内容は以下のとおりです.
ImageMagickによる描画事例です.
全コマンドを含むバッチファイルを下に示します.
bat_IMK.txt | このページの全コマンドを含むバッチファイル |
掲載内容は以下のとおりです.
rem Pixel 平面 rem Pixel座標は左上を原点とし角度は水平線より時計回りの角度が正 convert -size 350x300 xc:white -stroke blue ^ -fill navy -draw "translate 50,50 line 0,0 250,0" ^ -fill navy -draw "translate 50,50 polyline 240,-5 250,0 240,5" ^ -fill navy -draw "translate 50,50 rotate -90 line 0,0 -200,0" ^ -fill navy -draw "translate 50,50 rotate -90 polyline -190,-5 -200,0 -190,5" ^ -fill white -draw "translate 50,50 circle 150,87,150,90" ^ -fill none -draw "translate 50,50 stroke-dasharray 10 5 line 0,0 150,87" ^ -fill none -draw "translate 50,50 stroke-dasharray 3 2 ellipse 0,0 65,65 0,30" ^ -fill red -stroke none -pointsize 20 ^ -draw "translate 50,50 text 100,-5 'x-axsis'" ^ -draw "translate 50,50 rotate -90 text -130,-5 'y-axis'" ^ -draw "translate 50,50 rotate 15 text 70,5 'angle'" ^ -draw "translate 50,50 rotate -75 text -10,58 'a0'" ^ -draw "translate 50,50 text 125,110 '(x0,y0)'" ^ -draw "translate 50,50 text -25,-10 '(0,0)'" ^ -fill black -stroke none -pointsize 24 ^ -draw "translate 50,50 text 75,230 'Pixel plane'" ^ -scale 350x300 00coordinate.gif
rem -negate によりピクセル色を補色に変換 convert -negate 00coordinate.gif 00coordinate-n.gif
rem Point convert -size 10x6 xc:skyblue -fill black -draw "point 3,2" -scale 100x60 01draw_point.gif
rem Rectangle / Rounded Rectangle / Rectangular Arc convert -size 100x60 xc:skyblue -fill white -stroke black -draw "rectangle 20,10 80,50" 02draw_rect.gif convert -size 100x60 xc:skyblue -fill white -stroke black -draw "roundrectangle 20,10 80,50 20,15" 03draw_rrect.gif convert -size 100x60 xc:skyblue -fill white -stroke black -draw "arc 20,10 80,50 0,360" 04draw_arc.gif convert -size 100x60 xc:skyblue -fill white -stroke black -draw "arc 20,10 80,50 0,135" 05draw_arc_partial.gif
rem Circle / Ellipse (centered on a point) convert -size 100x60 xc:skyblue -fill white -stroke black -draw "circle 50,30 40,10" 06draw_circle.gif convert -size 100x60 xc:skyblue -fill white -stroke black -draw "ellipse 50,30 40,20 0,360" 07draw_ellipse.gif convert -size 100x60 xc:skyblue -fill white -stroke black -draw "ellipse 50,30 40,20 45,270" 08draw_ellipse_partial.gif
rem Line / Polyline / Polygon / Bezier convert -size 100x60 xc:skyblue -fill white -stroke black -draw "line 20,50 90,10" 09draw_line.gif convert -size 100x60 xc:skyblue -fill white -stroke black -draw "polyline 40,10 20,50 90,10 70,40" 10draw_polyline.gif convert -size 100x60 xc:skyblue -fill white -stroke black -draw "polygon 40,10 20,50 90,10 70,40" 11draw_polygon.gif convert -size 100x60 xc:skyblue -fill white -stroke black -draw "bezier 40,10 20,50 90,10 70,40" 12draw_bezier.gif
rem text の表示,imageの張り込み,図形の重ね合わせ convert -size 100x60 xc:skyblue -fill white -stroke black -font arial -pointsize 40 -gravity center -draw "text 0,0 'WAN'" 13draw_text.gif convert -size 100x60 xc:skyblue -gravity center -draw "image over 0,0 0,0 'wanz2.png'" 14draw_image.gif convert -size 100x60 xc:skyblue -fill red -draw "circle 50,30 40,10" 15draw_circle_global.gif convert -size 100x60 xc:skyblue -fill red -draw "fill green circle 50,30 40,10" 16draw_circle_override.gif convert -size 100x60 xc:skyblue -draw "fill green circle 41,39 44,57 fill blue circle 59,39 56,57 fill red circle 50,21 50,3" 17draw_circle_multi.gif
rem pathによる線分の指定 (z で閉曲線を指定できる) convert -size 100x60 xc:skyblue -fill white -stroke black -draw "path 'M 40,10 L 20,50 90,10 70,40'" 18path_open.gif convert -size 100x60 xc:skyblue -fill white -stroke black -draw "path 'M 40,10 L 20,50 90,10 70,40 40,10'" 19path_complete.gif convert -size 100x60 xc:skyblue -fill white -stroke black -draw "path 'M 40,10 20,50 90,10 70,40 Z'" 20path_closed.gif
rem 線の透過度を変化させる (stroke-opacity) convert -size 100x60 xc:skyblue -fill none -stroke black ^ -draw "path 'M 10,10 L 90,10'" ^ -draw "stroke-opacity 0.8 path 'M 10,20 L 90,20'" ^ -draw "stroke-opacity 0.6 path 'M 10,30 L 90,30'" ^ -draw "stroke-opacity 0.4 path 'M 10,40 L 90,40'" ^ -draw "stroke-opacity 0.2 path 'M 10,50 L 90,50'" ^ 21set_stroke_opacity.gif
rem 塗りつぶし色の透過度を変化させる (fill-opacity) convert -size 100x60 xc:skyblue -fill white -stroke black ^ -draw " rectangle 5,10 15,50 " ^ -draw "fill-opacity 0.8 rectangle 20,10 30,50 " ^ -draw "fill-opacity 0.6 rectangle 35,10 45,50 " ^ -draw "fill-opacity 0.4 rectangle 50,10 60,50 " ^ -draw "fill-opacity 0.2 rectangle 65,10 75,50 " ^ -draw "fill-opacity 0 rectangle 80,10 90,50 " ^ 22set_fill_opacity.gif
rem 線種テスト (strike-dasharray) convert -size 100x60 xc:skyblue -fill none -stroke black ^ -draw " path 'M 10,10 L 90,10'" ^ -draw "stroke-dasharray 5 3 path 'M 10,20 L 90,20'" ^ -draw "stroke-dasharray 5 5 path 'M 10,30 L 90,30'" ^ -draw "stroke-dasharray 10 3 3 3 path 'M 10,40 L 90,40'" ^ -draw "stroke-dasharray 1 6 path 'M 10,50 L 90,50'" ^ 23set_lines.gif
rem -fill white により点線の隙間をwhiteで埋める convert -size 100x60 xc:skyblue -fill white -stroke black ^ -draw " path 'M 10,10 L 90,10'" ^ -draw "stroke-dasharray 5 3 path 'M 10,20 L 90,20'" ^ -draw "stroke-dasharray 5 5 path 'M 10,30 L 90,30'" ^ -draw "stroke-dasharray 10 3 3 3 path 'M 10,40 L 90,40'" ^ -draw "stroke-dasharray 1 6 path 'M 10,50 L 90,50'" ^ 24set_lines_fill.gif
rem ライン端部処理 convert -size 100x60 xc:skyblue -fill white -stroke black -strokewidth 8 ^ -draw " path 'M 20,20 L 20,70'" ^ -draw "stroke-linecap butt path 'M 40,20 L 40,70'" ^ -draw "stroke-linecap round path 'M 60,20 L 60,70'" ^ -draw "stroke-linecap square path 'M 80,20 L 80,70'" ^ 25set_endcaps.gif
rem 円グラフ convert -size 140x130 xc:white -stroke black ^ -fill red -draw "path 'M 60,70 L 60,20 A 50,50 0 0,1 68.7,20.8 Z'" ^ -fill green -draw "path 'M 60,70 L 68.7,20.8 A 50,50 0 0,1 77.1,23.0 Z'" ^ -fill blue -draw "path 'M 68,65 L 85.1,18.0 A 50,50 0 0,1 118,65 Z'" ^ -fill gold -draw "path 'M 60,70 L 110,70 A 50,50 0 1,1 60,20 Z'" ^ -fill black -stroke none -pointsize 10 ^ -draw "text 57,19 '10' text 70,20 '10' text 90,19 '70' text 113,78 '270'" ^ 26piechart.gif
rem 四角形を回転 convert -size 100x60 xc:skyblue ^ -draw "translate 50,30 rotate 30 fill white stroke black rectangle -20,-10 20,10" ^ -draw "translate 50 30 fill none stroke red line -10,0 10,0 line 0,-10 0,10" ^ 27transform_translate.gif
rem 楕円を回転 convert -size 100x60 xc:skyblue ^ -draw "translate 50,30 rotate -30 fill white stroke black ellipse 0,0 30,15 0,360" ^ -draw "translate 50 30 fill none stroke red path 'M 0,10 0,-10 M 10,0 -10,0'" ^ 28transform_translate.gif
rem pathで描いた線を回転 convert -size 100x60 xc:skyblue ^ -draw "translate 50,30 rotate -30 fill white stroke black path 'M 0,20 -45,20 20,-25 -25,-25'" ^ -draw "translate 50 30 rotate 30 fill none stroke red path 'M 0,10 0,-10 M 10,0 -10,0'" ^ 29transform_translate.gif
rem 楕円を回転(pusy / pop) convert -size 100x60 xc:skyblue -fill white -stroke black ^ -draw "push graphic-context translate 50,30 rotate 30 fill white stroke black ellipse 0,0 30,15 0,360 pop graphic-context" ^ 30ellipse_rotated.gif
rem 四角形を回転(pusy / pop) convert -size 100x60 xc:skyblue -fill white -stroke black ^ -draw "push graphic-context translate 50,30 rotate 30 fill white stroke black rectangle -20,-10 20,10 pop graphic-context" ^ -draw "translate 50 30 fill none stroke red path 'M 0,10 0,-10 M 10,0 -10,0'" ^ 31rect_rotated.gif
rem 画像を連結する (カッコの使用:ブランクをあけることに注意) convert ( 02draw_rect.gif 03draw_rrect.gif +append ) ^ ( 04draw_arc.gif 06draw_circle.gif +append ) ^ -append 32test.gif
convert -size 25x25 -background LemonChiffon -fill black -font c:\Windows\Fonts\arialbd.ttf -pointsize 20 -gravity center -raise 5 label:W 0W1.gif convert -size 25x25 -background LemonChiffon -fill black -font c:\Windows\Fonts\arialbd.ttf -pointsize 20 -gravity center -raise 5 label:A 0A2.gif convert -size 25x25 -background LemonChiffon -fill black -font c:\Windows\Fonts\arialbd.ttf -pointsize 20 -gravity center -raise 5 label:N 0N3.gif convert -size 25x25 -background LemonChiffon -fill black -font c:\Windows\Fonts\arialbd.ttf -pointsize 20 -gravity center -raise 5 label:t 0t4.gif convert -size 25x25 -background LemonChiffon -fill black -font c:\Windows\Fonts\arialbd.ttf -pointsize 20 -gravity center -raise 5 label:a 0a5.gif convert -size 25x25 -background LemonChiffon -fill black -font c:\Windows\Fonts\arialbd.ttf -pointsize 20 -gravity center -raise 5 label:r 0r6.gif convert -size 25x25 -background LemonChiffon -fill black -font c:\Windows\Fonts\arialbd.ttf -pointsize 20 -gravity center -raise 5 label:o 0o7.gif convert -size 25x25 -background LemonChiffon -fill black -font c:\Windows\Fonts\arialbd.ttf -pointsize 20 -gravity center -raise 5 label:H 0H8.gif convert -size 25x25 -background LemonChiffon -fill black -font c:\Windows\Fonts\arialbd.ttf -pointsize 20 -gravity center -raise 5 label:P 0P9.gif convert +append 0W1.gif 0A2.gif 0N3.gif 0t4.gif 0a5.gif 0r6.gif 0o7.gif 0H8.gif 0P9.gif 33WANtaroHP.gif del 0W1.gif 0A2.gif 0N3.gif 0t4.gif 0a5.gif 0r6.gif 0o7.gif 0H8.gif 0P9.gif
convert -size 20x20 -background LemonChiffon -fill black -font c:\Windows\Fonts\arialbd.ttf -pointsize 20 -gravity center -frame 5x5+2+2 label:W 1W1.gif convert -size 20x20 -background LemonChiffon -fill black -font c:\Windows\Fonts\arialbd.ttf -pointsize 20 -gravity center -frame 5x5+2+2 label:A 1A2.gif convert -size 20x20 -background LemonChiffon -fill black -font c:\Windows\Fonts\arialbd.ttf -pointsize 20 -gravity center -frame 5x5+2+2 label:N 1N3.gif convert -size 20x20 -background LemonChiffon -fill black -font c:\Windows\Fonts\arialbd.ttf -pointsize 20 -gravity center -frame 5x5+2+2 label:t 1t4.gif convert -size 20x20 -background LemonChiffon -fill black -font c:\Windows\Fonts\arialbd.ttf -pointsize 20 -gravity center -frame 5x5+2+2 label:a 1a5.gif convert -size 20x20 -background LemonChiffon -fill black -font c:\Windows\Fonts\arialbd.ttf -pointsize 20 -gravity center -frame 5x5+2+2 label:r 1r6.gif convert -size 20x20 -background LemonChiffon -fill black -font c:\Windows\Fonts\arialbd.ttf -pointsize 20 -gravity center -frame 5x5+2+2 label:o 1o7.gif convert -size 20x20 -background LemonChiffon -fill black -font c:\Windows\Fonts\arialbd.ttf -pointsize 20 -gravity center -frame 5x5+2+2 label:H 1H8.gif convert -size 20x20 -background LemonChiffon -fill black -font c:\Windows\Fonts\arialbd.ttf -pointsize 20 -gravity center -frame 5x5+2+2 label:P 1P9.gif convert +append 1W1.gif 1A2.gif 1N3.gif 1t4.gif 1a5.gif 1r6.gif 1o7.gif 1H8.gif 1P9.gif 34WANtaroHP.gif del 1W1.gif 1A2.gif 1N3.gif 1t4.gif 1a5.gif 1r6.gif 1o7.gif 1H8.gif 1P9.gif
rem ********************************************* rem 漢字を含む2行の文字列を配置した画像 wan.bat rem ********************************************* rem rem 文字を作成します.漢字はUTF8Nで保存したファイル(wan_inp.txt)より読み込みます. rem この際改行文字を読み込んで2行になってしまうので,trimで余白を削除します. convert -trim -background none -fill navy -font c:\Windows\Fonts\meiryo.ttc -pointsize 11 label:WANtaroHP wan0U.png convert -trim -background none -fill navy -font c:\Windows\Fonts\meiryo.ttc -pointsize 14 label:@wan_inp.txt wan0D.png rem rem 後で-raiseで画像の内縁に3ピクセルの枠をつけるため,borderで透明な部分を上下に追加します. convert -bordercolor none -border 0x3 wan0U.png temp0U.png convert -bordercolor none -border 0x3 wan0D.png temp0D.png rem rem 単色背景:背景画像を作成し透過背景の文字列と合成します. rem また -raise で少し浮き上がる効果を出します. convert -size 88x31 canvas:aqua wan1b.png composite -gravity north temp0U.png wan1b.png temp1.png composite -gravity south temp0D.png temp1.png temp.png convert -raise 3 temp.png wanz1.png rem rem グラデーション:背景画像にグラデーションを入れてみました. rem ここでも上側と下側に分けて背景を作成し -append で合成しています convert -size 88x15 gradient:yellow-white temp1.png convert -size 88x16 gradient:white-yellow temp2.png convert -append temp1.png temp2.png wan2b.png composite -gravity north temp0U.png wan2b.png temp1.png composite -gravity south temp0D.png temp1.png temp.png convert -raise 3 temp.png wanz2.png rem rem プラズマグラデーション:プラズマグラデーションの背景画像を使ってみました. convert -size 88x31 plasma:white-white wan3b.png composite -gravity north temp0U.png wan3b.png temp1.png composite -gravity south temp0D.png temp1.png temp.png convert -raise 3 temp.png wanz3.png rem rem 作業用のファイルを削除します. del temp*.png
透過文字の作成は,以下の3段階の手順により実行されています.
rem ************************************************************************* rem Create image with transparent characters rem ************************************************************************* set font=c:\Windows\Fonts\arialbd.ttf set col=blue rem set col=lightyellow convert -monochrome -size 95x16 -background white -fill black ^ -font %font% -pointsize 12 -gravity center -raise 3 label:"En : main page" png_test01.png convert -fuzz 50% -transparent black png_test01.png png_inp.png convert -fill %col% -opaque white png_inp.png 35png_inlinkGOE.png convert -monochrome -size 95x16 -background white -fill black ^ -font %font% -pointsize 12 -gravity center -raise 3 label:"Ja : main page" png_test01.png convert -fuzz 50% -transparent black png_test01.png png_inp.png convert -fill %col% -opaque white png_inp.png 35png_inlinkGOJ.png convert -monochrome -size 55x16 -background white -fill black ^ -font %font% -pointsize 12 -gravity center -raise 3 label:"Top" png_test01.png convert -fuzz 50% -transparent black png_test01.png png_inp.png convert -fill %col% -opaque white png_inp.png 35png_inlinkT.png convert -monochrome -size 55x16 -background white -fill black ^ -font %font% -pointsize 12 -gravity center -raise 3 label:"Bottom" png_test01.png convert -fuzz 50% -transparent black png_test01.png png_inp.png convert -fill %col% -opaque white png_inp.png 35png_inlinkB.png