CanvasRenderingContext2D.measureText()

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

構文

TextMetrics ctx.measureText(text);

引数

text
測定する文字列。

戻り値

TextMetrics オブジェクト。

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

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

以下のコードを使用して TextMetrics オブジェクトを得ることができます:

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

var text = ctx.measureText("foo"); // TextMetrics オブジェクト
text.width; // 16;

仕様

仕様書 策定状況 コメント
HTML Living Standard
CanvasRenderingContext2D.measureText の定義
現行の標準  

ブラウザ実装状況

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeEdge MobileAndroid 版 FirefoxAndroid 版 OperaiOS 版 SafariSamsung Internet
基本対応Chrome 完全対応 ありEdge 完全対応 12Firefox 完全対応 ありIE 完全対応 9Opera 完全対応 ありSafari 完全対応 ありWebView Android 完全対応 ありChrome Android 完全対応 ありEdge Mobile 完全対応 ありFirefox Android 完全対応 ありOpera Android 完全対応 ありSafari iOS 完全対応 ありSamsung Internet Android 完全対応 あり

凡例

完全対応  
完全対応

関連情報

ドキュメントのタグと貢献者

このページの貢献者: woodmix, yyss
最終更新者: woodmix,