Path2D: Path2D() Konstruktor

path Optional

Bei Aufruf mit einem anderen Path2D Objekt wird eine Kopie des path-Arguments erstellt.

d Optional

Bei Aufruf mit einem String, der aus SVG-Pfad-Daten besteht, wird ein neuer Pfad aus dieser Beschreibung erstellt.

Dieses Beispiel erstellt und kopiert einen Path2D Pfad.

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

const canvas = document.getElementById("canvas");
const ctx = canvas.getContext("2d");

let path1 = new Path2D();
path1.rect(10, 10, 100, 100);

let path2 = new Path2D(path1);
path2.moveTo(220, 60);
path2.arc(170, 60, 50, 0, 2 * Math.PI);

ctx.stroke(path2);

Dieses Beispiel erstellt einen Path2D Pfad unter Verwendung von SVG-Pfad-Daten. Der Pfad bewegt sich zu Punkt (M10 10) und dann 80 Punkte horizontal nach rechts (h 80), dann 80 Punkte nach unten (v 80), dann 80 Punkte nach links (h -80) und schließlich zurück zum Start (Z).

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

const canvas = document.getElementById("canvas");
const ctx = canvas.getContext("2d");

let p = new Path2D("M10 10 h 80 v 80 h -80 Z");
ctx.fill(p);

• Path2D, das Interface, zu dem dieser Konstruktor gehört