Javascript代码显示文本

Javascript code display text

本文关键字：文本 显示 代码 Javascript      更新时间：2023-09-26

有一个矩形的代码，其中有一行穿过它，我想在矩形下显示文本。如何将其添加到代码中？或者有人能为我指明正确的方向吗？

<canvas id="main" width="300" height="300"></canvas>
 <script>
 var canvas = document.getElementById("main");
var context = canvas.getContext('2d');
context.fillStyle = "#008000";
context.rect(0,0,300,300);
context.fill();
context.beginPath();
context.lineWidth = 10;
context.strokeStyle = "blue";
context.lineCap = "round";
context.moveTo( 50, 150);
context.lineTo (250, 150);
context.stroke();
  context.closePath();

您可以使用fillText:绘制文本

context.fillText("Hello, world!", 50, 50);

有关更多信息，请参阅Mozilla开发者网络上的这篇文章。

我相信您想要fillText函数：

context.font="30px Arial";
context.fillText("Hello World",10,50);
相关文章：