HTML5 canvas上に文字（テキスト）を書く
CanvasはHTML5から新しく加わった機能で画面に描画をすることができます。
当然、文字も書けます。
次のように書いてみましょう。
下記のfillTextメソッドを利用します。
//一番目の引数が表示したい文字、2番目がX座標、3番目がY座標
context.fillText("Sample String", 10, 50);
fontプロパティで、文字の大きさやフォントの種類が指定できます。
context.font = "20pt Arial";
注：プロパティの指定は、context.fillTextの前に書きましょう。
全部のドキュメントの例です。
<!DOCTYPE html>
<html><head><meta charset="utf-8"></head>
<body>
<canvas id="a_canvas" width="300" height="300"></canvas>
<script type="text/javascript">
var canvas = document.getElementById("a_canvas");
var context = canvas.getContext("2d");
context.font = "20pt Arial";
context.fillText("Sample String", 10, 50);
</script>
</body></html>
- ここここ — {2017-07-07 (金) 19:22:03}
- ありがとう — {2017-07-07 (金) 19:22:45}
- わーいわーい — うえの {2017-09-03 (日) 08:00:18}