html 文本最后有个X,html5 – HTML画布;给定两个X和两个Y,中心文本

我正在制作一系列矩形.这不是整个脚本,这段代码实际上是在一个函数中,带有x和y坐标的参数以及高度和宽度的参数.此函数将用于创建多个矩形.我的问题是我需要将文本置于x,y,宽度和高度的矩形中心……文本的长度会有所不同.

Your browser does not support the canvas element.

var x = 10;

var y = 10;

var width = 180;

var height = 75;

var c = document.getElementById("myCanvas");

ctx = c.getContext("2d");

ctx.lineWidth = 5;

ctx.strokeStyle="black";

ctx.strokeRect(x,y,width,height);

ctx.textBaseline = 'top';

ctx.font = '20px Sans-Serif';

ctx.fillStyle = 'blue';

ctx.fillText ("hello", 30, 50);