Path2D

コンストラクター

Path2D()

Path2D コンストラクターです。新しい Path2D オブジェクトを生成します。

インスタンスメソッド

Path2D.addPath()

パスを現在のパスに追加します。

Path2D.closePath()

ペンの点を現在のサブパスの開始点に戻します。現在の点から開始点まで直線を引こうとします。シェイプが既に閉じられていたり、点が 1 つしかなかったりする場合、この関数は何もしません。

Path2D.moveTo()

新しいサブパスの始点を (x, y) 座標に移動します。

Path2D.lineTo()

サブパスの最後の点から (x, y) 座標まで直線を引きます。

Path2D.bezierCurveTo()

パスに 3 次ベジェ曲線を追加します。これには 3 つの点が必要です。最初の 2 点は制御点であり、 3 点目は終点です。始点は現在のパスの最後の点であり、 ベジェ曲線を作成する前に moveTo() を用いて変更することができます。

Path2D.quadraticCurveTo()

現在のパスに 2 次ベジェ曲線を追加します。

Path2D.arc()

(x, y) の位置を中心とし、半径 r で startAngle から始まり endAngle で終わる弧をパスに追加します。方向が反時計回りの場合は counterclockwise を指定します（既定では時計回り方向です）。

Path2D.arcTo()

指定された制御点と半径を持つパスに弧を追加し、最後の点と直線で接続します。

Path2D.ellipse()

(x, y) の位置を中心とし、半径が radiusX と radiusY で、 startAngle から始まり endAngle で終わる楕弧をパスに追加します。方向が反時計回りの場合は counterclockwise を指定します（既定では時計回り方向です）。

Path2D.rect()

位置 (x, y) に width と height で指定された大きさの長方形のパスを作成します。

Path2D.roundRect()

位置 (x, y) に角丸長方形のパスを作成します。大きさは width と height で決定され、長方形の角に使用する弧の半径は radii で決定されます。

仕様書

ブラウザーの互換性

関連情報

• CanvasRenderingContext2D