CanvasRenderingContext2D.direction

实验性: 这是一项实验性技术
在将其用于生产之前,请仔细检查浏览器兼容性表格

CanvasRenderingContext2D.direction 是 Canvas 2D API 用来在绘制文本时,描述当前文本方向的属性。

语法

ctx.direction = "ltr" || "rtl" || "inherit";

选项

有效值:

ltr

文本方向从左向右。

rtl

文本方向从右向左。

inherit

根据情况继承 <canvas> 元素或者 Document

默认值是 inherit

示例

使用 direction 属性

这是一段简单的代码片段,对文本设置不同的 direction 数值。

HTML

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

JavaScript

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

ctx.font = "48px serif";
ctx.fillText("Hi!", 150, 50);
ctx.direction = "rtl";
ctx.fillText("Hi!", 150, 130);

结果

规范

Specification
HTML Standard
# dom-context-2d-direction-dev

浏览器兼容性

BCD tables only load in the browser

参见