path

サンプル  サンプル(内容確認)

<pxd>
  <page>
    <svg>
      <path>
属性必要意味
dデータ
例:d="M 100 100 L 300 100 L 200 300 z"
以下、最初の1文字が大文字の場合は絶対座標を示し、小文字の場合は相対座標を示す。
M 100 100 (x=100, y=100の位置に移動する)
Z (パスを閉じる) L 100 100 (x=100, y=100の位置まで線を引く)
H 100 (x=100 の位置まで水平線を引く)
V 100 (y=100 の位置まで垂直線を引く)
C 100,100 250,100 250,200 (三次ベジェ曲線。値はx1,y1 x2,y2 x,y の順。)
   (第一制御点(x1,y1)、第二制御点(x2,y2)、終点(x,y))
S 100,100 250,100 (三次ベジェ曲線。値はx2,y2 x,yの順。)
   (第一制御点は前の命令の第二制御点の現在の点に対する鏡像)
Q 100,100 200,200 (二次ベジェ曲線。値は x1,y1 x,yの順。)
   (制御点(x1,y1)、終点(x,y)) T 200,200 (二次ベジェ曲線。x,yの順)
   (制御点は前の命令の制御点の現在の点に対する鏡像)
A 25,25 -30 0,1 50,-25 (楕円。値は、rx ry x-axis-rotation large-arc-flag sweep-flag x y)
   (現在の点から点(x,y)へ楕円形の弧を描く。楕円の半径はrx,ry 楕円のX軸回転はx-axis-rotation、弧が180度以上の場合large-arc-flagは1で以下の場合0、この角度が正の向きの場合1で負の向きは0)
stroke-width数値
例:stroke-width="3mm"
  線の太さを指定します。
stroke
例:red
例:#FF11BB
例:rgb(255,255,0)
例:none
  線の色を指定します。
fillstrokeの場合と同じ   四角形内の塗りつぶし色を指定します。
fill-opacity数値0(透明)〜1(不透明)
例:fill-opacity="0.5"
  塗りつぶしの透明度を指定します。
stroke-opacity数値0(透明)〜1(不透明)
例:stroke-opacity="0.5"
  線の透明度を指定します。
opacity数値0(透明)〜1(不透明)
例:opacity="0.5"
  全体の透明度を指定します。
stroke-dasharray数値(カンマ区切り)
例:stroke-dasharray="10,20"
  線を点線にします。
class自由
例:title
  スタイルを参照する。