CanvasRenderingContext2D: getLineDash() Methode

Keine.

Ein Array von Zahlen, das die Abstände angibt, um abwechselnd eine Linie zu zeichnen und eine Lücke (in Koordinatenraumeinheiten). Wenn die Anzahl der Elemente ungerade ist, werden die Elemente des Arrays kopiert und verknüpft. Zum Beispiel führt das Festlegen des Strichmusters auf [5, 15, 25] dazu, dass man [5, 15, 25, 5, 15, 25] zurückbekommt.

Dieses Beispiel demonstriert die Nutzung der getLineDash() Methode.

HTML

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

JavaScript

Wie durch setLineDash() festgelegt, bestehen Striche aus Linien, die 10 Einheiten breit sind, mit Abständen von 20 Einheiten zwischen jeder Linie.

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

ctx.setLineDash([10, 20]);
console.log(ctx.getLineDash()); // [10, 20]

// Draw a dashed line
ctx.beginPath();
ctx.moveTo(0, 50);
ctx.lineTo(300, 50);
ctx.stroke();

Ergebnis

• Die Schnittstelle, die diese Methode definiert: CanvasRenderingContext2D
• CanvasRenderingContext2D.setLineDash()
• CanvasRenderingContext2D.lineDashOffset