CanvasRenderingContext2D: direction-Eigenschaft
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since Mai 2022.
Die Eigenschaft CanvasRenderingContext2D.direction der Canvas 2D-API gibt die aktuelle Textrichtung an, die zum Zeichnen von Text verwendet wird.
Wert
Mögliche Werte:
"ltr"-
Die Textrichtung ist von links nach rechts.
"rtl"-
Die Textrichtung ist von rechts nach links.
"inherit"-
Die Textrichtung wird vom
<canvas>-Element oder demDocumententsprechend geerbt. Standardwert.
Der Standardwert ist "inherit".
Beispiele
Ändern der Textrichtung
In diesem Beispiel werden zwei Textstücke gezeichnet. Das erste ist von links nach rechts, und das zweite ist von rechts nach links. Beachten Sie, dass "Hi!" in ltr zu "!Hi" in rtl wird.
HTML
html
<canvas id="canvas"></canvas>
JavaScript
js
const canvas = document.getElementById("canvas");
const ctx = canvas.getContext("2d");
ctx.font = "48px serif";
ctx.fillText("Hi!", 150, 50);
ctx.direction = "rtl";
ctx.fillText("Hi!", 150, 130);
Ergebnis
Spezifikationen
| Specification |
|---|
| HTML # dom-context-2d-direction-dev |
Browser-Kompatibilität
Loading…
Siehe auch
- Das Interface, das diese Eigenschaft definiert:
CanvasRenderingContext2D