CanvasRenderingContext2D: lineWidth-Eigenschaft
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since Juli 2015.
Die CanvasRenderingContext2D.lineWidth-Eigenschaft der Canvas 2D API legt die Dicke von Linien fest.
Hinweis:
Linien können mit den
stroke(),
strokeRect(),
und strokeText() Methoden gezeichnet werden.
Wert
Eine Zahl, die die Linienstärke in Koordinatenraumeinheiten angibt. Werte wie Null, negativ, Infinity, und NaN werden ignoriert. Der Standardwert ist 1.0.
Beispiele
Änderung der Linienstärke
In diesem Beispiel wird eine Linie und ein Rechteck gezeichnet, wobei eine Linienstärke von 15 Einheiten verwendet wird.
HTML
<canvas id="canvas"></canvas>
JavaScript
const canvas = document.getElementById("canvas");
const ctx = canvas.getContext("2d");
ctx.lineWidth = 15;
ctx.beginPath();
ctx.moveTo(20, 20);
ctx.lineTo(130, 130);
ctx.rect(40, 40, 70, 70);
ctx.stroke();
Ergebnis
Weitere Beispiele
Weitere Beispiele und Erklärungen zu dieser Eigenschaft finden Sie unter Anwenden von Stilen und Farben im Canvas-Tutorial.
Spezifikationen
| Specification |
|---|
| HTML # dom-context-2d-linewidth-dev |
Browser-Kompatibilität
Loading…
Siehe auch
- Das Interface, das diese Eigenschaft definiert:
CanvasRenderingContext2D CanvasRenderingContext2D.lineCapCanvasRenderingContext2D.lineJoin- Anwenden von Stilen und Farben