Właściwość direction

Właściwość direction określa kierunek tekstu narysowanego za pomocą metody fillText lub metody strokeText. Przyjmuje jedną z możliwych wartości: ltr (od lewej do prawej), rtl (od prawej do lewej), inherit (dziedziczone). Domyślnie wartość jest ustawiona na inherit (dla języka arabskiego i hebrajskiego będzie to rtl, ponieważ pisze się tam od prawej do lewej, a dla wszystkich pozostałych - ltr).

Składnia

kontekst.direction = ltr lub rtl lub inherit;

Przykład

Narysujmy tekst i ustawmy mu różne kierunki za pomocą właściwości direction:

<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>

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

ctx.font = "16px arial";
ctx.fillText("text1", 150, 50);
ctx.direction = "rtl";
ctx.fillText("text1", 50, 120);

Zobacz także

właściwość textBaseline,
która wyrównuje tekst w pionie
właściwość textAlign,
która wyrównuje tekst w poziomie