Javascript 是否可以在内部缩放文本<；帆布>；没有按屏幕大小细分？

一些新的编码和第一次海报以及。我一直在研究画布上的一本书，并决定尝试制作一个简单的“按钮”页面，该页面基本上会随机显示“真”或“假”

我将canvas.width/height设置为与innerwindow匹配。一切都是无缝的，因为我有一个调整大小的事件，除了文本，因为它保持静态。我知道我可以根据屏幕的分辨率进行设置，但正如前面提到的，我正在寻找一种完全无缝的方式，因为我调整了窗口的大小，使文本显示在“按钮”的中心，并随着它进行缩放。我尝试过使用context.scale，但没有效果。可能吗

window.addEventListener（'resize'，function（）{canvas.width=window.innerWidth；canvas.height=window.innerHeight；createPage（）；}，false）；
var canvas=document.getElementById（“draw”）；
var context=canvas.getContext（“2d”）；
函数createCircle（）{
context.beginPath（）；//这有什么作用吗？在我使用它之前，它是有效的
弧（canvas.width/2，canvas.height/2，canvas.width*（.09），0360，false）；
context.fillStyle=“白色”；
context.fill（）；
//正文
context.fillStyle=“black”；
context.font=“bold 1em sans serif”；
context.textbrealine=“middle”；
//这里有点混乱，试图将文本居中
context.fillText（“推”，canvas.width*（.44），canvas.height/2）；
}
函数createPage（）{
canvas.width=window.innerWidth；canvas.height=window.innerHeight；
//蓝色的
context.fillStyle=“#002db3”；
context.fillRect（0,0，canvas.width，canvas.height）；
//红色的
context.fillStyle=“#cc0000”；
context.fillRect（0,0，canvas.width，canvas.height*（0.5））；
//圈
createCircle（）；
}
//白色闪烁，设置超时（是/否）
函数无望（）{
context.fillStyle=“绿色”；
context.fillRect（0,0，canvas.width，canvas.height）；
context.fillStyle=“black”；
context.font=“bold 1em sans serif”；
context.textbrealine=“middle”；
context.fillText（“不丢失所有内容”，canvas.width*（.3），canvas.height/2）；
设置超时（createPage，1000）；
}
函数hope（）{
context.fillStyle=“蓝色”；
context.fillRect（0,0，canvas.width，canvas.height）；
context.fillStyle=“black”；
context.font=“bold 1em sans serif”；
context.textbrealine=“middle”；
context.fillText（“是的，还有希望”，canvas.width*（.2），canvas.height/2）；
设置超时（createPage，1000）；
}
函数yesOrNo（）{
如果（Math.random（）更改

致：

喜欢吗？谢谢@Jack，这是一个非常简单的居中解决方案。你知道在调整窗口大小时如何缩放文本吗？再次感谢！
context.fillText("PUSH", canvas.width*(.44), canvas.height/2);

var btnText = "PUSH";
var btnTextSize = context.measureText(btnText);
var textX = (canvas.width / 2) - (btnTextSize.width / 2);
var textY = (canvas.height / 2);
context.fillText(btnText, textX, textY);