Propriété direction

La propriété direction définit le sens du texte dessiné avec la méthode fillText ou la méthode strokeText. Accepte l'une des valeurs possibles : ltr (de gauche à droite), rtl (de droite à gauche), inherit (hérité). Par défaut, la valeur est inherit (pour l'arabe et l'hébreu, ce sera rtl, car on y écrit de droite à gauche, et pour toutes les autres langues - ltr).

Syntaxe

javascriptcontexte.direction = ltr ou rtl ou inherit;

Exemple

Écrivons un texte et définissons-lui différentes directions avec la propriété direction :

html<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>
javascriptconst 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);

Результат:

Voir aussi

  • la propriété textBaseline,
    qui aligne le texte verticalement
  • la propriété textAlign,
    qui aligne le texte horizontalement