CanvasRenderingContext2D.measureText()

CanvasRenderingContext2D.measureText() メソッドは、測定したテキストの情報（例えば幅など）を持つ TextMetrics (en-US) オブジェクトを返します。

構文

js

ctx.measureText(text);

引数

text

測定する文字列。

返値

TextMetrics (en-US) オブジェクト。

例

以下の <canvas> 要素があるとします。

html

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

以下のコードを使用して TextMetrics (en-US) オブジェクトを得ることができます。

js

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

let text = ctx.measureText('Hello world');
console.log(text.width);  // 56;

仕様書

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

ブラウザーの互換性

BCD tables only load in the browser

関連情報