fillTextメソッド
メソッド fillText は、canvas上に指定された
テキストを描画します。最初のパラメータはテキスト自体を受け取り、
2番目と3番目は、そのテキストを配置する点の座標です。
フォントのサイズとタイプは、プロパティ
font
を使用して設定します。
構文
コンテキスト.strokeRect(テキスト, x, y);
例
fillText を使用してcanvasにテキストを描画し、
サイズを 30px、タイプをArialに設定してみましょう:
<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>
let canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');
ctx.font = '30px Arial';
ctx.fillText('Hello world', 30, 50);
:
関連項目
-
メソッド
strokeText、
これはcanvas上に指定されたテキストの輪郭を描画します -
プロパティ
font、
これはフォントのサイズとタイプを設定します