Path2D: addPath() メソッド

addPath(path)
addPath(path, transform)

<canvas id="canvas"></canvas>

const canvas = document.getElementById("canvas");
const ctx = canvas.getContext("2d");
// rect で新しいパスを作成する
let p1 = new Path2D();
p1.rect(0, 0, 100, 150);
// rect で別のパスを作成する
let p2 = new Path2D();
p2.rect(0, 0, 100, 75);
// 右に縦 300 ポイント移動する変換行列を作成する
let m = new DOMMatrix();
m.a = 1;
m.b = 0;
m.c = 0;
m.d = 1;
m.e = 200;
m.f = 0;
// 2 番目のパスを最初のパスに追加する
p1.addPath(p2, m);
// 最後に、 1 番目のパスをキャンバスに描画する
ctx.fill(p1);