Để vẽ một văn bản đã điền trên canvas trong HTML5, hãy sử dụng phương thức fillText (). Đây là cú pháp của phương thức fillText (). Nó điền vào văn bản đã cho ở vị trí nhất định được chỉ ra bởi các tọa độ x và y đã cho. Màu mặc định là đen.
fillText(text, x, y [, maxWidth ] )
Dưới đây là các giá trị tham số của phương thức fillText ():
| S. Không | Thông số | Mô tả |
| 1 | văn bản | Văn bản được viết |
| 2 | x | x tọa độ |
| 3 | y | y tọa độ |
| 4 | maxWidth | Chiều rộng tối đa cho phép, tính bằng pixel |
Ví dụ
Bạn có thể thử chạy mã sau để vẽ văn bản với fillText () trong HTML5:
<!DOCTYPE html>
<html>
<head>
<title>HTML5 Canvas fillText()</title>
</head>
<body>
<canvas id="newCanvas" width="400" height="150" style="border:1px solid #000000;"></canvas>
<script>
var c = document.getElementById("newCanvas");
var ctxt = c.getContext("2d");
ctxt.fillStyle = '#00F';
ctxt.font = "20px Georgia";
ctxt.fillText("Tutorialspoint", 10, 50);
ctxt.fillStyle = '#Cff765';
ctxt.font = "30px Verdana";
ctxt.fillText("Simply Easy Learning!", 10, 90);
</script>
</body>
</html>